@extends('layouts.admin')

@section('estilos')
  <link href="{{ asset('assets/css/bootstrap-datepicker3.min.css') }}" rel="stylesheet">
@endsection

@section('contenido')
  <section>
    <div class="row">
      <div class="box-header with-border pull-right">
        <button class="btn btn-primary" data-toggle="modal" data-target="#modal-NwPaquete"><i class="fa fa-plus"></i>&nbsp;&nbsp;Nuevo paquete</button>
        <button class="btn btn-info" data-toggle="modal" data-target="#modal-paquetes"><i class="fa fa-eye"></i>&nbsp;&nbsp;Ver paquetes</button>
        <button class="btn btn-success" data-toggle="modal" data-target="#modal-AsPaquete"><i class="fa fa-certificate"></i>&nbsp;&nbsp;Asignar paquete</button>
      </div>
    </div>
    <div class="scroll-x m-t-10">
      <table id="tblAsignados" class="table table-striped table-bordered" style="width:100%;">
        <thead>
          <th>Empresa</th>
          <th>Paquete asignado</th>
          <th>Fecha inicio</th>
          <th>Timbres del paquete</th>
          <th>Timbrados</th>
          <th>Cancelados</th>
          <th>Usados</th>
          <th>Restantes</th>
          <th></th>
        </thead>
      </table>
    </div>
  </section>


  <!-- MODALS DE FORMULARIOS -->

  <div class="modal fade" id="modal-paquetes" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">Paquetes de facturaci&oacute;n</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <table id="tblPaquetes" class="table table-striped table-bordered">
            <thead>
              <th>Paquete</th>
              <th>Folios</th>
              <th></th>
            </thead>
          </table>
        </div>
        <div class="modal-footer">
          <button class="btn btn-secondary" data-dismiss="modal"><i class="fa fa-close"></i>&nbsp;&nbsp;Cerrar</button>
        </div>
      </div>
    </div>
  </div>


  <div class="modal fade" id="modal-NwPaquete" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        {!!Form::open(array('url'=>url('paquetesfactura'),'method'=>'POST','autocomplete'=>'off','enctype'=>'multipart/form-data'))!!}
        <div class="modal-header">
          <h5 class="modal-title">Crear nuevo paquete</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <div class="form-group">
            <label class="required">Nombre</label>
            <input type="text" class="form-control" name="nombre" data-regla="texto" data-msg="Ingrese un nombre válido" required/>
          </div>
          <div class="form-group">
            <label class="required">Cantidad de folios</label>
            <input type="number" class="form-control" name="folios" data-msg="Ingrese un número entero" min="0" required/>
          </div>
        </div>
        <div class="modal-footer">
          <button class="btn btn-default" type="reset" data-dismiss="modal"><i class="fa fa-close"></i> Cancelar</button>
          <button class="btn btn-primary" type="submit"><i class="fa fa-save"></i>&nbsp;&nbsp;Guardar</button>
        </div>
        {!!Form::close()!!}
      </div>
    </div>
  </div>

  <div class="modal fade" id="modal-EdPaquete" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        {!!Form::open(array('url'=>url('paquetesfactura'),'method'=>'PATCH','autocomplete'=>'off','enctype'=>'multipart/form-data'))!!}
        <div class="modal-header">
          <h5 class="modal-title">Editar informacion de paquete</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <div class="form-group">
            <label class="required">Nombre</label>
            <input type="text" class="form-control" name="nombre" data-regla="texto" data-msg="Ingrese un nombre válido" required/>
          </div>
          <div class="form-group">
            <label class="required">Cantidad de folios</label>
            <input type="number" class="form-control" name="folios" data-msg="Ingrese un número entero" min="0" required/>
          </div>
        </div>
        <div class="modal-footer">
          <button class="btn btn-default" type="reset" data-dismiss="modal"><i class="fa fa-close"></i> Cancelar</button>
          <button class="btn btn-primary" type="submit"><i class="fa fa-save"></i>&nbsp;&nbsp;Guardar</button>
        </div>
        {!!Form::close()!!}
      </div>
    </div>
  </div>

  <div class="modal fade" id="modal-AsPaquete" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        {!!Form::open(array('url'=>url('paqueteasignadofactura'),'method'=>'POST','autocomplete'=>'off','enctype'=>'multipart/form-data'))!!}
        <div class="modal-header">
          <h5 class="modal-title">Asignar paquete</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <div class="form-group">
            <label class="required">Empresa</label>
            <select name="empresa" class="form-control">
              @foreach ($ES as $E)
                <option value="{{$E->emp_id}}">{{$E->emp_nombre}}</option>
              @endforeach
            </select>
          </div>
          <div class="form-group">
            <label class="required">Paquete</label>
            <select name="paquete" class="form-control" required>
              @foreach ($PS as $P)
                <option value="{{$P->pf_id}}">{{$P->pf_nombre}}</option>
              @endforeach
            </select>
          </div>
          <div class="form-group">
            <label class="required">Fecha de inicio</label>
            <input type="text" name="inicio" class="form-control datepicker" placeholder="yyyy-mm-dd" data-regla="fecha" data-msg="Seleccione una fecha válida por favor" value="{{date('Y-m-d')}}" required/>
          </div>
        </div>
        <div class="modal-footer">
          <button class="btn btn-default" type="reset" data-dismiss="modal"><i class="fa fa-close"></i> Cancelar</button>
          <button class="btn btn-primary" type="submit"><i class="fa fa-save"></i>&nbsp;&nbsp;Guardar</button>
        </div>
        {!!Form::close()!!}
      </div>
    </div>
  </div>

  <div class="modal fade" id="modal-asignados" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">Historial de paquetes</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
        </div>
        <div class="modal-footer">
          <button class="btn btn-secondary" data-dismiss="modal"><i class="fa fa-close"></i>&nbsp;&nbsp;Cerrar</button>
        </div>
      </div>
    </div>
  </div>
@endsection

@section('script')
  <script src="{{ asset('assets/plugins/bootstrap-datepicker.min.js') }}"></script>
  <script src="{{ asset('assets/plugins/bootstrap-datepicker.es.min.js') }}"></script>
  <script src="{{ asset('js/paquetes/index.js') }}"></script>
  <script src="{{ asset('js/formularios.js') }}"></script>
@endsection