@extends('admin.admin_dashboard_hipotecario')
@section('content')

@foreach($expedientes as $expedientes)@endforeach

<link rel="stylesheet" href="{{ URL::asset('css/plugins/datepicker-bs5.min.css')}}">


<div class="pc-container">
    <div class="pc-content">
      <!-- [ breadcrumb ] start -->
      <div class="page-header">
        <div class="page-block">
          <div class="row align-items-center">
            <div class="col-md-12">
              <ul class="breadcrumb mb-3">
                <li class="breadcrumb-item"><a href="../home">Inicio</a></li>
                <li class="breadcrumb-item"><a href="../inventario">Avalúo</a></li> 
              </ul> 
            </div>
            <div class="col-md-12">
             

              <div class="page-header-title col-md-4">
                <h3 class="mb-0">Expediente - No. {{$expedientes->id}} </h3>
              </div> 
            </div>
          </div>
        </div>
      </div>
      <!-- [ breadcrumb ] end -->

            <!-- [ Main Content ] start -->
      <div class="row">
        <!-- [ sample-page ] start -->
          <div class="card">
            <div class="card-body p-0">
              <ul class="nav nav-tabs checkout-tabs mb-0" id="myTab" >
                <li class="nav-item"> 
                    <div class="media align-items-center"> 
                      <div class="media-body ms-0">
                       <span style=" margin-right: 20px;">Fecha de creación: </span> 
                        <span class="badge bg-light-primary  f-12">{{$expedientes->created_at}}</span> 
                        <span style="margin-left: 20px; margin-right: 20px;"> Usuario: </span> 
                        <span class="badge bg-light-primary  f-12">Administrador</span> 
                        <span style="margin-left: 20px; margin-right: 20px;"> Estatus: </span> 
                       
                            <span class="badge bg-warning  f-12">En espera de aprobación por Coordinador</span> 
                            <span style=" margin-left: 20px;">Fecha de solicitud: </span> 
                            <span class="badge bg-light-primary f-12">{{$expedientes->created_at}}</span> 
                       
                      

                      </div>
                    </div> 
                </li>
              </ul>
            </div>
          </div>
 <div class="col-sm-12">
          <div class="card">
            <div class="card-body p-0">
              <ul class="nav nav-tabs checkout-tabs mb-0" id="myTab" role="tablist">
                <li class="nav-item"> 
                  <a class="nav-link "  href="../../expediente_precalif/edit/{{ $expedientes->id}}">
                    <div class="media align-items-center">
                      <div class="avtar avtar-s">
                        <i class="ti ti-shopping-cart"></i>
                      </div>
                      <div class="media-body ms-2">
                        <h5 class="mb-0">Precalificación</h5>
                      </div>
                    </div>
                  </a>
                </li>
                <li class="nav-item">
                  <a class="nav-link " href="../../expediente_avaluo/edit/{{ $expedientes->id}}" role="tab"
                    aria-controls="ecomtab-2" aria-selected="true">
                    <div class="media align-items-center">
 
                      <div class="avtar avtar-s">
                        <i class="ti ti-building-skyscraper"></i>
                      </div>
                      <div class="media-body ms-2">
                        <h5 class="mb-0">Avalúo </h5>
                      </div>
 

                    </div>
                  </a>
                </li> 

                <li class="nav-item">
                  <a class="nav-link active"  href="../../expediente_instruccion/edit/{{ $expedientes->id}}" role="tab"
                    aria-controls="ecomtab-2" aria-selected="true">
                    <div class="media align-items-center">
 
                      <div class="avtar avtar-s" style="background-color: purple ">
                        <i class="ti ti-building-skyscraper" ></i>
                      </div>
                      <div class="media-body ms-2">
                        <h5 class="mb-0" style="color: purple">Instrucción </h5>
                      </div>
 

                    </div>
                  </a>
                </li> 


                <li class="nav-item"> 
                  <a class="nav-link " href="../../expediente_firma/edit/{{ $expedientes->id}}" role="tab" 
                    aria-controls="ecomtab-2" aria-selected="true">
                    <div class="media align-items-center">
 
                      <div class="avtar avtar-s">
                        <i class="ti ti-building-skyscraper"></i>
                      </div>
                      <div class="media-body ms-2">
                        <h5 class="mb-0">Firma </h5>
                      </div>
 

                    </div>
                  </a>
                </li> 

                <li class="nav-item">
                  <a class="nav-link" href="../../ordenes_trabajo/edit_herramienta/{{ $expedientes->id}}" role="tab"
                    aria-controls="ecomtab-2" aria-selected="true">
                    <div class="media align-items-center">
 
                      <div class="avtar avtar-s">
                        <i class="ti ti-building-skyscraper"></i>
                      </div>
                      <div class="media-body ms-2">
                        <h5 class="mb-0">Formalizado </h5>
                      </div>
 

                    </div>
                  </a>
                </li> 
 

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

<!---------------------TABS------------------------------------------->

          <div class="tab-content">
            
             <div
                        class="tab-pane fade show active"
                        id="analytics-tab-1-pane"
                        role="tabpanel"
                        aria-labelledby="analytics-tab-1"
                        tabindex="0"
                      >
             <form class="smart-form" enctype="multipart/form-data"  method="POST" >
                @csrf
                <input type="hidden" name="id" value="{{$expedientes->id}}">
 
                  <div>
                     <div class="form-group">
                      <div class="d-flex gap-1"> 

                        <button type="submit" id="guardar_btn" name="guardar_btn" value="guardar_form" class="btn btn-primary" >Guardar </button>

                             <div id="ModalCoordinadorPrecalif" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="ModalCoordinadorPrecalifTitle" aria-hidden="true">
                    <div class="modal-dialog modal-dialog-centered" role="document">
                      <div class="modal-content">
                        <div class="modal-header">
                          <h5 class="modal-title" id="ModalCoordinadorPrecalifTitle">Enviar a Coordinador</h5>
                          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                        </div>
                        <div class="modal-body">
                          <p>Agregue comentarios para enviar al Coordinador</p> 
                            <textarea id="envio_avaluo" name="envio_avaluo" type="text" class="form-control" rows="5" ></textarea>  
                        </div>
                        <div class="modal-footer">
                          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
                          <a class="btn btn-warning" href="../../expediente_precalif/edit/{{ $expedientes->id}}" >
                            Enviar a Coordinador</a>
                        </div>
                      </div>
                    </div>
                  </div>

                        <button type="button" id="guardar_btn" name="guardar_btn" value="cambio_status_solicita_aprobacion"  class="btn btn-outline-warning" data-bs-toggle="modal"
                        data-bs-target="#ModalCoordinadorPrecalif" >Enviar a coordinador</button>
                    

                         <div id="ModalAvaluo" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="ModalAvaluoTitle" aria-hidden="true">
                    <div class="modal-dialog modal-dialog-centered" role="document">
                      <div class="modal-content">
                        <div class="modal-header">
                          <h5 class="modal-title" id="ModalAvaluoTitle">Enviar a Firma</h5>
                          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                        </div>
                        <div class="modal-body">
                          <p>Agregue comentarios para enviar a Firma</p> 
                            <textarea id="envio_avaluo" name="envio_avaluo" type="text" class="form-control" rows="5" ></textarea>  
                        </div>
                        <div class="modal-footer">
                          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
                          <a  style="background-color: darkgreen" class="btn btn-success" href="../../expediente_firma/edit/{{ $expedientes->id}}" >
 Enviar a Firma</a>
                        </div>
                      </div>
                    </div>
                  </div>
                        <button type="button" id="guardar_btn" name="guardar_btn" value="cambio_status_aprobado_1"  class="btn btn-success" data-bs-toggle="modal"
                        data-bs-target="#ModalAvaluo" style="background-color: darkgreen"> Enviar a Firma</button> 
                      
 


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

          

              <div class="row"> 
                <div class="col-md-6"> 
                  <div class="form-group">
                    <label class="form-label">Notaría</label> 
                    <input id="proyecto" name="proyecto" type="text" class="form-control" placeholder="" value=" "> 
                  </div> 
               </div>

               <div class="col-md-6"> 
                  <div class="form-group">
                    <label class="form-label">Contacto Notaría</label> 
                    <input id="proyecto" name="proyecto" type="text" class="form-control" placeholder="" value=" "> 
                  </div> 
               </div> 

              </div>

              <div class="row"> 
                <div class="col-md-6"> 
                  <div class="form-group">
                    <label class="form-label">Teléfonos</label> 
                    <input id="proyecto" name="proyecto" type="text" class="form-control" placeholder="" value=" "> 
                  </div> 
               </div>

               <div class="col-md-6"> 
                  <div class="form-group">
                    <label class="form-label">Monto de Crédito</label> 
                    <input id="proyecto" name="proyecto" type="text" class="form-control" placeholder="" value="$1,000,000 "> 
                  </div> 
               </div> 

              </div>

 

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

              <div class="page-header-title col-md-4">
                <h3 class="mb-0">BITÁCORA </h3>
              </div> 
            </div>
                 <div class="row">
               <table id="table-inventory-cat" class="table table-striped table-bordered">
                    <thead>
                      <tr>
                      <th>Fecha </th> 
                      <th>Estado</th>          
                      <th>Observación</th>          
                      <th >Nombre</th>   
                      </tr>
                    </thead>
                    <tbody>
                      <tr> 
                         <td>2024-10-14 14:23:08</td> 
                         <td>Avalúo - Revisión</td>
                         <td>Seguimiento a expedienter</td>
                         <td>Juan Antonio Butrón</td> 
                      </tr>
                       <tr> 
                         <td>2024-10-14 14:23:08</td> 
                         <td>Avalúo - Análisis</td>
                         <td>Seguimiento a expedienter</td>
                         <td>Juan Antonio Butrón</td> 
                      </tr>
                    </tbody>
                  </table>

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

<!---------------------TABS------------------------------------------->
  
        <div
            class="tab-pane fade show"
            id="analytics-tab-2-pane"
            role="tabpanel"
            aria-labelledby="analytics-tab-2"
            tabindex="1"
          >

<div class="row"> 
                <div class="col-md-5"> 
                  <div class="form-group">
                    <label class="form-label">Material</label> 
                    <input id="proyecto" name="proyecto" type="text" class="form-control" placeholder="" value=""> 
                  </div> 
               </div>
                

              <div class="col-md-2">
                 
                  <div class="form-group"> 
                    <button type="submit" class="form-control btn btn-primary" >Agregar</button>

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



      <div class="row"> 


  <table id="table-inventory-cat" class="table table-striped table-bordered">
                    <thead>
                      <tr>
                        <th>Nombre</th>     
                        <th>Eliminar</th>
                      </tr>
                    </thead>
                    <tbody>
                         

                      <tr> 
                      <td>ALICATAS</td>   
                        <td class="text-center">
                        <ul class="list-inline me-auto mb-0"> 
                        
                          <li class="list-inline-item align-bottom" data-bs-toggle="tooltip" title="">
                            <a href="#" class="avtar avtar-xs btn-link-danger btn-pc-default">
                              <i class="ti ti-trash f-18"></i>
                            </a>
                          </li>
                        </ul>
                      </td>
                      </tr>

                       <tr> 
                      <td>SUJETADORES CON MATRACA</td>   
                        <td class="text-center">
                        <ul class="list-inline me-auto mb-0"> 
                        
                          <li class="list-inline-item align-bottom" data-bs-toggle="tooltip" title="">
                            <a href="#" class="avtar avtar-xs btn-link-danger btn-pc-default">
                              <i class="ti ti-trash f-18"></i>
                            </a>
                          </li>
                        </ul>
                      </td>
                      </tr>

                       <tr> 
                      <td>ESLINGAS DE MATRACA</td>   
                        <td class="text-center">
                        <ul class="list-inline me-auto mb-0"> 
                        
                          <li class="list-inline-item align-bottom" data-bs-toggle="tooltip" title="">
                            <a href="#" class="avtar avtar-xs btn-link-danger btn-pc-default">
                              <i class="ti ti-trash f-18"></i>
                            </a>
                          </li>
                        </ul>
                      </td>
                      </tr>

                       <tr> 
                      <td>ALICATAS</td>   
                        <td class="text-center">
                        <ul class="list-inline me-auto mb-0"> 
                        
                          <li class="list-inline-item align-bottom" data-bs-toggle="tooltip" title="">
                            <a href="#" class="avtar avtar-xs btn-link-danger btn-pc-default">
                              <i class="ti ti-trash f-18"></i>
                            </a>
                          </li>
                        </ul>
                      </td>
                      </tr>

<tr> 
                      <td>ALICATAS</td>   
                        <td class="text-center">
                        <ul class="list-inline me-auto mb-0"> 
                        
                          <li class="list-inline-item align-bottom" data-bs-toggle="tooltip" title="">
                            <a href="#" class="avtar avtar-xs btn-link-danger btn-pc-default">
                              <i class="ti ti-trash f-18"></i>
                            </a>
                          </li>
                        </ul>
                      </td>
                      </tr>
                      <tr> 
                      <td>JUEGO DE PISTOLA Y MATRACA NEUMATICA</td>   
                        <td class="text-center">
                        <ul class="list-inline me-auto mb-0"> 
                        
                          <li class="list-inline-item align-bottom" data-bs-toggle="tooltip" title="">
                            <a href="#" class="avtar avtar-xs btn-link-danger btn-pc-default">
                              <i class="ti ti-trash f-18"></i>
                            </a>
                          </li>
                        </ul>
                      </td>
                      </tr>
                      <tr> 
                      <td>KIT MOTOTUL NEUMATICO</td>   
                        <td class="text-center">
                        <ul class="list-inline me-auto mb-0"> 
                        
                          <li class="list-inline-item align-bottom" data-bs-toggle="tooltip" title="">
                            <a href="#" class="avtar avtar-xs btn-link-danger btn-pc-default">
                              <i class="ti ti-trash f-18"></i>
                            </a>
                          </li>
                        </ul>
                      </td>
                      </tr>

 

                

                    </tbody> 
                  </table>
      </div>
      </div>

<!---------------------TABS------------------------------------------->
  
        <div
            class="tab-pane fade show"
            id="analytics-tab-3-pane"
            role="tabpanel"
            aria-labelledby="analytics-tab-3"
            tabindex="2"
          >
 
<div class="row"> 
                <div class="col-md-5"> 
                  <div class="form-group">
                    <label class="form-label">Herramienta</label> 
                    <input id="proyecto" name="proyecto" type="text" class="form-control" placeholder="" value=""> 
                  </div> 
               </div>
                

              <div class="col-md-2">
                 
                  <div class="form-group"> 
                    <button type="submit" class="form-control btn btn-primary" >Agregar</button>

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



      <div class="row"> 


  <table id="table-inventory-cat" class="table table-striped table-bordered">
                    <thead>
                      <tr>
                        <th>Nombre</th>     
                        <th>Eliminar</th>
                      </tr>
                    </thead>
                    <tbody>
                         

                      <tr> 
                      <td>ALICATAS</td>   
                        <td class="text-center">
                        <ul class="list-inline me-auto mb-0"> 
                        
                          <li class="list-inline-item align-bottom" data-bs-toggle="tooltip" title="">
                            <a href="#" class="avtar avtar-xs btn-link-danger btn-pc-default">
                              <i class="ti ti-trash f-18"></i>
                            </a>
                          </li>
                        </ul>
                      </td>
                      </tr>

                      <tr> 
                      <td>CAJA DE HERRAMIENTA NEGRA DE 60 CM</td>   
                        <td class="text-center">
                        <ul class="list-inline me-auto mb-0"> 
                        
                          <li class="list-inline-item align-bottom" data-bs-toggle="tooltip" title="">
                            <a href="#" class="avtar avtar-xs btn-link-danger btn-pc-default">
                              <i class="ti ti-trash f-18"></i>
                            </a>
                          </li>
                        </ul>
                      </td>
                      </tr>


                      <tr> 
                      <td>PINZAS MECANICAS SIN FORRO </td>   
                        <td class="text-center">
                        <ul class="list-inline me-auto mb-0"> 
                        
                          <li class="list-inline-item align-bottom" data-bs-toggle="tooltip" title="">
                            <a href="#" class="avtar avtar-xs btn-link-danger btn-pc-default">
                              <i class="ti ti-trash f-18"></i>
                            </a>
                          </li>
                        </ul>
                      </td>
                      </tr>

                      <tr> 
                      <td>PINZAS CLAMP</td>   
                        <td class="text-center">
                        <ul class="list-inline me-auto mb-0"> 
                        
                          <li class="list-inline-item align-bottom" data-bs-toggle="tooltip" title="">
                            <a href="#" class="avtar avtar-xs btn-link-danger btn-pc-default">
                              <i class="ti ti-trash f-18"></i>
                            </a>
                          </li>
                        </ul>
                      </td>
                      </tr>


                

                    </tbody> 
                  </table>
      </div>
      </div>


<!---------------------TABS------------------------------------------->
  
        <div
            class="tab-pane fade show "
            id="analytics-tab-4-pane"
            role="tabpanel"
            aria-labelledby="analytics-tab-4"
            tabindex="3"
          >

      

<div class="row"> 
                <div class="col-md-3"> 
                  <div class="form-group">
                    <label class="form-label">Nombre</label> 
                    <input id="proyecto" name="proyecto" type="text" class="form-control" placeholder="" value=""> 
                  </div> 
               </div>
               <div class="col-md-1"> 
                    <label class="form-label">Asistió</label>  
                  <div class="form-group">
                    <div class="form-check form-check-inline">
                        <input class="form-check-input" type="radio" name="group5" value="" id="customCheckinlh1">
                        <label class="form-check-label" for="customCheckinlh1"> SI  </label>
                      </div>
                      <div class="form-check form-check-inline">
                        <input class="form-check-input" type="radio" name="group5" value="" id="customCheckinlh2">
                        <label class="form-check-label" for="customCheckinlh2"> NO </label>
                      </div>
                  </div> 
               </div>

                <div class="col-md-4"> 
                  <div class="form-group">
                    <label class="form-label">Comentarios</label> 
                    <input id="proyecto" name="proyecto" type="text" class="form-control" placeholder="" value=""> 
                  </div> 
               </div>

              <div class="col-md-2">
                 
                  <div class="form-group"> 
                    <button type="submit" class="form-control btn btn-primary" >Agregar</button>

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



      <div class="row"> 


  <table id="table-inventory-cat" class="table table-striped table-bordered">
                    <thead>
                      <tr>
                        <th>Nombre</th>    
                        <th>Asistencia</th>
                        <th>Comentarios</th> 
                        <th>Eliminar</th>
                      </tr>
                    </thead>
                    <tbody>
                         

                      <tr> 
                      <td>José Juan Dominguez</td>  
                      <td>Asistió</td>    
                      <td>Observaciones</td>     
                      
                        <td class="text-center">
                        <ul class="list-inline me-auto mb-0"> 
                        
                          <li class="list-inline-item align-bottom" data-bs-toggle="tooltip" title="">
                            <a href="#" class="avtar avtar-xs btn-link-danger btn-pc-default">
                              <i class="ti ti-trash f-18"></i>
                            </a>
                          </li>
                        </ul>
                      </td>
                      </tr>


                      <tr> 
                      <td>José Juan Dominguez</td>  
                      <td>Asistió</td>    
                      <td>Observaciones</td>     
                      
                        <td class="text-center">
                        <ul class="list-inline me-auto mb-0"> 
                        
                          <li class="list-inline-item align-bottom" data-bs-toggle="tooltip" title="">
                            <a href="#" class="avtar avtar-xs btn-link-danger btn-pc-default">
                              <i class="ti ti-trash f-18"></i>
                            </a>
                          </li>
                        </ul>
                      </td>
                      </tr>


                      <tr> 
                      <td>José Juan Dominguez</td>  
                      <td>Asistió</td>    
                      <td>Observaciones</td>     
                      
                        <td class="text-center">
                        <ul class="list-inline me-auto mb-0"> 
                        
                          <li class="list-inline-item align-bottom" data-bs-toggle="tooltip" title="">
                            <a href="#" class="avtar avtar-xs btn-link-danger btn-pc-default">
                              <i class="ti ti-trash f-18"></i>
                            </a>
                          </li>
                        </ul>
                      </td>
                      </tr>
                

                    </tbody> 
                  </table>
      </div>
      </div>

<!---------------------TABS------------------------------------------->
  
        <div
            class="tab-pane fade  show"
            id="analytics-tab-5-pane"
            role="tabpanel"
            aria-labelledby="analytics-tab-5"
            tabindex="4"
          >
      <div class="row">  
              <div id="sig"  class="kbw-signature"></div>
              <p style="clear: both;">
                <button id="disable">Disable</button> 
                <button id="clear">Clear</button> 
                <button id="json">To JSON</button>
                <button id="svg">To SVG</button>
              </p> 
 
              </div>
      </div>


        </div>
        <!-- [ sample-page ] end -->
      </div>
      <!-- [ Main Content ] end -->
    </div>
  </div>
  </div>

          <!-- DOM/Jquery table end -->
<!--main--> 

    <!-- datatable Js --> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="{{ URL::asset('js/plugins/jquery.dataTables.min.js')}}"></script>
<script src="{{ URL::asset('js/plugins/dataTables.bootstrap5.min.js')}}"></script>
<script src="{{ URL::asset('js/plugins/dataTables.responsive.min.js')}}"></script>
<script src="{{ URL::asset('js/plugins/responsive.bootstrap5.min.js')}}"></script>
<script src="{{ URL::asset('js/plugins/popper.min.js')}}"></script>
<script src="{{ URL::asset('js/plugins/simplebar.min.js')}}"></script>
<script src="{{ URL::asset('js/plugins/bootstrap.min.js')}}"></script>
<script src="{{ URL::asset('js/fonts/custom-font.js')}}"></script>
<script src="{{ URL::asset('js/pcoded.js')}}"></script>
<script src="{{ URL::asset('js/plugins/feather.min.js')}}"></script>

<script src="{{ URL::asset('js/plugins/datepicker-full.min.js')}}"></script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="{{ URL::asset('js/jquery.signature.js')}}"></script>




<script>layout_change('light');</script>




<script>layout_sidebar_change('false');</script>



<script>change_box_container('false');</script>


<script>layout_caption_change('true');</script>




<script>layout_rtl_change('false');</script>


<script>preset_change("fecha_ini");</script> 
<script>preset_change("fecha_fin");</script> 
<script>preset_change("fecha_entrega_cotizacion");</script> 

<style>
.kbw-signature { width: 800px; height: 400px; }
 
</style>


    <script>
      // [ DOM/jquery ] 
      /*
      (function () {
        const d_week = new Datepicker(document.querySelector('#fecha_ini'), {
          buttonClass: 'btn'
        });
      })();

      (function () {
        const d_week = new Datepicker(document.querySelector('#fecha_fin'), {
          buttonClass: 'btn'
        });
      })();

      (function () {
        const d_week = new Datepicker(document.querySelector('#fecha_entrega_cotizacion'), {
          buttonClass: 'btn'
        });

      })();
      */


       $("#fecha_ini").datepicker( {   
    todayBtn: "linked", 
            keyboardNavigation: false,
            forceParse: false, 
            autoclose: true
}); 

        $("#fecha_fin").datepicker( {   
    todayBtn: "linked", 
            keyboardNavigation: false,
            forceParse: false, 
            autoclose: true
}); 
 $(document).ready(function()
            {
              // minimum setup

    
          var sig = $('#sig').signature();
            $('#disable').click(function() {
              var disable = $(this).text() === 'Disable';
              $(this).text(disable ? 'Enable' : 'Disable');
              sig.signature(disable ? 'disable' : 'enable');
            });
            $('#clear').click(function() {
              sig.signature('clear');
            });
            $('#json').click(function() {
              alert(sig.signature('toJSON'));
            });
            $('#svg').click(function() {
              alert(sig.signature('toSVG'));
            });
     
     // [ Configuration Option ]
      $('#table-inventory-cat').dataTable(
                { 
                    responsive: false,  
                    ordering: false, 
                    autoWidth: false,
                    pagingType: 'full_numbers',
                    dom: "<'row mb-3'<'col-sm-12 col-md-6 d-flex align-items-right justify-content-start'f><'col-sm-12 col-md-6 d-flex align-items-left justify-content-end'B>>" +
                        "<'row'<'col-sm-12'tr>>" +
                        "<'row'<'col-sm-12 col-md-5'i><'col-sm-12 col-md-7'p>>",
                    buttons: [
                        {
                            extend: 'colvis',
                            text: 'Column Visibility',
                            titleAttr: 'Col visibility',
                            className: 'btn-outline-default'
                        },
                        {
                            extend: 'csvHtml5',
                            text: 'CSV',
                            titleAttr: 'Generate CSV',
                            className: 'btn-outline-default'
                        },
                        {
                            extend: 'copyHtml5',
                            text: 'Copy',
                            titleAttr: 'Copy to clipboard',
                            className: 'btn-outline-default'
                        },
                        {
                            extend: 'print',
                            text: '<i class="fal fa-print"></i>',
                            titleAttr: 'Print Table',
                            className: 'btn-outline-default'
                        }

                    ], 

                    

                }); // FIN DE TABLA
         // [ Configuration Option ]
      $('#table-requisicion').dataTable(
                {
                    responsive: true,
                    fixedHeader: true, 
                    select: 'single',
                    ordering: false, 
                    dom:  "<'row'<'col-sm-12'tr>>" +
                        "<'row'<'col-sm-12 col-md-5'i><'col-sm-12 col-md-7'p>>",
                    buttons: [
                        {
                            extend: 'colvis',
                            text: 'Column Visibility',
                            titleAttr: 'Col visibility',
                            className: 'btn-outline-default'
                        },
                        {
                            extend: 'csvHtml5',
                            text: 'CSV',
                            titleAttr: 'Generate CSV',
                            className: 'btn-outline-default'
                        },
                        {
                            extend: 'copyHtml5',
                            text: 'Copy',
                            titleAttr: 'Copy to clipboard',
                            className: 'btn-outline-default'
                        },
                        {
                            extend: 'print',
                            text: '<i class="fal fa-print"></i>',
                            titleAttr: 'Print Table',
                            className: 'btn-outline-default'
                        }

                    ], 

                    

                }); // FIN DE TABLA       
    }); // FIN DE TABLA
 
 function change_tab(tab_name) {
      var someTabTriggerEl = document.querySelector('a[href="' + tab_name + '"]');
      var actTab = new bootstrap.Tab(someTabTriggerEl);
      actTab.show();
    }

      var tc = document.querySelectorAll('.scroll-block');
      for (var t = 0; t < tc.length; t++) {
        new SimpleBar(tc[t]);
      }
      // quantity start
      function increaseValue(temp) {
        var value = parseInt(document.getElementById(temp).value, 10);
        value = isNaN(value) ? 0 : value;
        value++;
        document.getElementById(temp).value = value;
      }

      function decreaseValue(temp) {
        var value = parseInt(document.getElementById(temp).value, 10);
        value = isNaN(value) ? 0 : value;
        value < 1 ? (value = 1) : '';
        value--;
        document.getElementById(temp).value = value;
      }

      function checkbox_change($this, $req_detalle){
        if($this.value == 0){
                $this.value = 1;
                $("#id_req_txt_"+$req_detalle+"").val(1);
              }
        else{
                $this.value = 0;
                $("#id_req_txt_"+$req_detalle+"").val(0);
              }
 

      }

      function unit_change($this, $id_prod, $unidad, $unidad_conversion, $existencia, $existencia_conversion){
         
         var $unidad_empaque;
         var $nueva_existencia;

         $unidad_empaque = $("#inlineFormSelectPref_"+$id_prod+" option:selected" ).text();

      console.log('$unidad_empaque'+$unidad_empaque);
         
        if($this.value == 0){
                $("#id_invent_txt_"+$id_prod+"").val($existencia); 
         }
         else{
                $nueva_existencia = $existencia/$existencia_conversion;
                $("#id_invent_txt_"+$id_prod+"").val($nueva_existencia); 
         }
                
          $("#unidad_empaque_"+$id_prod+"").val($unidad_empaque);
        
         //console.log('$unidad val:'+$("#unidad_empaque_"+$id_prod+"").val());

      }




    </script>

    <style type="text/css">
      #table-inventory-cat {
          table-layout:fixed;
        }
        #table-inventory-cat td {
          word-wrap: break-word !important; 
          white-space:inherit;
        }
    </style>

@stop