@extends('layouts.app')
@section('style')   
<link rel="stylesheet" type="text/css" href="{{asset('datatable/DataTables-1.10.20/css/jquery.dataTables.min.css')}}">
<link rel="stylesheet" type="text/css" href="{{asset('datatable/DataTables-1.10.20/css/dataTables.bootstrap4.min.css')}}">
<link rel="stylesheet" type="text/css" href="{{asset('datatable/Buttons-1.6.1/css/buttons.dataTables.min.css')}}">
<link rel="stylesheet" type="text/css" href="{{asset('datatable/Select-1.3.1/css/select.dataTables.min.css')}}">
<style type="text/css" media="screen">
table tbody th, table tbody td {
    padding: 2px 10px !important; /* e.g. change 8x to 4px here */
}
table thead th, table thead td {
    padding: 5px 10px !important; /* e.g. change 8x to 4px here */
    text-align: center;
}
table.dataTable tbody th, table.dataTable tbody td {
    padding: 2px 10px; /* e.g. change 8x to 4px here */
}
table.dataTable thead th, table.dataTable thead td {
    padding: 10px 10px; /* e.g. change 8x to 4px here */
    text-align: center;
}
.sub-menu a:hover, .sub-menu a:focus {
    color: #f7fcf7;
    background: #408adb;
}
table.dataTable tbody tr.selected, table.dataTable tbody tr.selected:hover {
    background-color: #B0BED9 !important;
    color: red !important;
}
table.dataTable tbody tr:hover {
    background-color: #F3F6F9 !important;
}

td.details-control {
    background: url('datatable/details_open.png') no-repeat center center;
    cursor: pointer;
}
tr.shown td.details-control {
    background: url('datatable/details_close.png') no-repeat center center;
}
	
</style>
@endsection
    

@section('content')
<div class="card-header">
    <h2>Expedientes de documentos en proceso </h2> 
</div>
      
    @if (session('status'))
        <div class="alert alert-success" role="alert">
            {{ session('status') }}
        </div>
    @endif
<div class="table-responsive">
    <button style="display: none;" id="btn_eliminar">Elimina Fila Datatable</button>
    <table class="table table-bordered table-hover" id="documentoproceso_table" style="font-size: 11px;" width="100%">
       <thead class="table-success">
        <tr>
            <th >COLOR</th>
            <th width="5%">#</th>
            <th >CUT</th>
            <th >TUPA</th>
            <th >TIPO</th>
            <th >ORIGEN</th>
            <th >TIP.DOC.</th>
            <th >NUMERO</th>
            <th >ASUNTO</th>
            <th >FOLIOS</th>
            <th >RECEPCION</th>
            <th >DESTINATARIO</th>
            <th >DIAS</th>
            <th >OBSERVACION</th>
        </tr>
       </thead>
   </table>
</div>
<ul id="menuCapa" class="dropdown-menu sub-menu"  role="menu" aria-labelledby="dropdownMenu1" style="width: auto; height: 250px; overflow: auto">            
  <a role="menuitem" class="dropdown-item pointer "  tabindex="-1"  onClick="asingnar();"><i class="fas fa-user-check"></i> Asignar destinatario</a>
  <a role="menuitem" class="dropdown-item pointer "  tabindex="-1"  onClick="desasignar();"><i class="fas fa-user-alt-slash"></i> Quitar destinatario</a>
<li class="dropdown-divider"></li>  
    <a role="menuitem" class="dropdown-item pointer "  tabindex="-1"  onClick="pasar();"><i class="fas fa-check-double"></i> Pasar expediente</a>   
<li class="dropdown-divider"></li>                  
  <a role="menuitem" class="dropdown-item pointer "  tabindex="-1"  onClick="anexar();"><i class="fas fa-paperclip"></i> Anexar documento</a>
  <a role="menuitem" class="dropdown-item pointer "  tabindex="-1"  onClick="modificardocumento();"><i class="fas fa-pencil-alt"></i> Modificar documento</a>
  <a role="menuitem" class="dropdown-item pointer " tabindex="-1"  onClick="desanexar();"><i class="fas fa-unlink"></i> Desanexar documento</a>
<li class="dropdown-divider"></li>
  <a role="menuitem" class="dropdown-item pointer " tabindex="-1"  onClick="modificar();"><i class="fa fa-edit"></i> Modificar expediente</a>
  <a role="menuitem" class="dropdown-item pointer " tabindex="-1"  onClick="archivar();"><i class="fas fa-archive"></i> Archivar expediente</a>
<li class="dropdown-divider"></li>
  <a role="menuitem" class="dropdown-item pointer " tabindex="-1"  onClick="verexpediente();"><i class="far fa-eye"></i> Ver expediente</a>
  <a role="menuitem" class="dropdown-item pointer " tabindex="-1"  onClick="verruta();"><i class="fas fa-wave-square"></i> Ver ruta</a>
  <a role="menuitem" class="dropdown-item pointer " tabindex="-1"  onClick="imprimirruta();"><i class="fa fa-print"></i> Imprimir ruta 1</a>
  <a role="menuitem" class="dropdown-item pointer " tabindex="-1"  onClick="imprimirruta2();"><i class="fa fa-print"></i> Imprimir ruta 2</a>

</ul>
<ul id="menuCapa2" class="dropdown-menu sub-menu"  role="menu" aria-labelledby="dropdownMenu1">            
  <a role="menuitem" class="dropdown-item pointer "  tabindex="-1"  onClick="pasar();"><i class="fas fa-check-double"></i> Pasar expedientes</a>  
</ul>
<ul id="menuCapa3" class="dropdown-menu sub-menu"  role="menu" aria-labelledby="dropdownMenu1" style="z-index: 2048;">            
  <a role="menuitem" class="dropdown-item pointer " tabindex="-1"  onClick="verrutamodal();"><i class="fas fa-wave-square"></i> Ver ruta</a>
  <a role="menuitem" class="dropdown-item pointer " tabindex="-1"  onClick="imprimirrutamodal();"><i class="fa fa-print"></i> Imprimir ruta 1</a>
  <a role="menuitem" class="dropdown-item pointer " tabindex="-1"  onClick="imprimirrutamodal2();"><i class="fa fa-print"></i> Imprimir ruta 2</a>
</ul>
<!-- Modal -->
<form id="frm" action="#" method="post" enctype="multipart/form-data">
<div class="modal fade" id="ModalScrollable" tabindex="-1" role="dialog" aria-labelledby="exampleModalScrollableTitle" aria-hidden="true" style="z-index: 2048;" >
    <div class="modal-dialog modal-dialog-scrollable modal-xl" role="document">
        <div class="modal-content" id="modal_content">
		<div class="modal-body">
		</div>
        </div>
    </div>
</div> 
</form>	

<form id="frmvarios" name="frmvarios" action="#" method="post" enctype="multipart/form-data">
<div class="modal fade" id="Modalvarios" tabindex="-1" role="dialog" aria-labelledby="exampleModalScrollableTitle" aria-hidden="true">
    <div class="modal-dialog " role="document">
        <div class="modal-content" id="modalcontvarios">
            
        </div>
    </div>
</div>
</form> 
<form id="frmedit" action="#" method="post" enctype="multipart/form-data">
<div class="modal fade" id="Modaledit" tabindex="-1" role="dialog" aria-labelledby="exampleModalScrollableTitle" aria-hidden="true">
    <div class="modal-dialog modal-dialog-scrollable modal-xl" role="document">
        <div class="modal-content" id="modalcontedit">
         <div class="modal-body">
        </div>   
        </div>
    </div>
</div>
</form> 
<form id="frmeditdoc" action="#" method="post" enctype="multipart/form-data">
<div class="modal fade" id="Modaleditdoc" tabindex="-1" role="dialog" aria-labelledby="exampleModalScrollableTitle" aria-hidden="true" style="z-index: 2048;">
    <div class="modal-dialog modal-dialog-scrollable" role="document">
        <div class="modal-content" id="modalconteditdoc">
         <div class="modal-body">
        </div>   
        </div>
    </div>
</div>
</form> 
<div class="modal fade" id="ModalLista" tabindex="-1" role="dialog" aria-labelledby="exampleModalScrollableTitle" aria-hidden="true" style="z-index: 2048;">
    <div class="modal-dialog modal-xl" role="document">
        <div class="modal-content" id="modaltable">
            
        </div>
    </div>
</div>
<div class="modal fade" id="ModalExpediente" tabindex="-1" role="dialog" aria-labelledby="exampleModalScrollableTitle" aria-hidden="true">
    <div class="modal-dialog modal-dialog-scrollable modal-xl" role="document">
        <div class="modal-content" id="modaltableexpediente">
        <div class="modal-body">
        </div>
        </div>
    </div>
</div>
@endsection
@section('scripts')
<script src="{{asset('js/documentosproceso.js?v1')}}"></script>
<script type="text/javascript" src="{{asset('datatable/DataTables-1.10.20/js/jquery.dataTables.min.js')}}"></script>
<script type="text/javascript" src="{{asset('datatable/DataTables-1.10.20/js/dataTables.bootstrap4.min.js')}}"></script>
<script type="text/javascript" src="{{asset('datatable/Buttons-1.6.1/js/dataTables.buttons.min.js')}}"></script>
<script type="text/javascript" src="{{asset('datatable/Buttons-1.6.1/js/buttons.flash.min.js')}}"></script>
<script type="text/javascript" src="{{asset('datatable/JSZip-2.5.0/jszip.min.js')}}"></script>
<script type="text/javascript" src="{{asset('datatable/pdfmake-0.1.36/pdfmake.min.js')}}"></script>
<script type="text/javascript" src="{{asset('datatable/pdfmake-0.1.36/vfs_fonts.js')}}"></script>
<script type="text/javascript" src="{{asset('datatable/Buttons-1.6.1/js/buttons.html5.min.js')}}"></script>
<script type="text/javascript" src="{{asset('datatable/Buttons-1.6.1/js/buttons.print.min.js')}}"></script>
<script type="text/javascript" src="{{asset('datatable/Buttons-1.6.1/js/buttons.colVis.min.js')}}"></script>
<script type="text/javascript" src="{{asset('datatable/Select-1.3.1/js/dataTables.select.min.js')}}"></script>
<script src="{{asset('js/input-mask/jquery.inputmask.js')}}"></script>
<script src="{{asset('js/input-mask/jquery.inputmask.date.extensions.js')}}"></script>
<script src="{{asset('js/input-mask/jquery.inputmask.regex.extensions.js')}}"></script>
@endsection