@extends('layouts.app', ['activePage' => 'clientes', 'titlePage' => __('Autos')])

@section('content')

<style>
body{
    font-weight:  bold;
}
label{
    font-weight:  bold;
}
#bottom-stuff {
    padding: 0px 30px 30px 30px;
    margin-left:150px;
    position: relative;
}

#bottom{

    position: absolute; bottom: 0px; 
}
.ui-autocomplete-input {
  border: none; 
  font-size: 14px;
  width: 300px;
  height: 24px;
  margin-bottom: 5px;
  padding-top: 2px;
  border: 1px solid #DDD !important;
  padding-top: 0px !important;
  z-index: 1511;
  position: relative;
}
.ui-menu .ui-menu-item a {
  font-size: 12px;
}
.ui-autocomplete {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1510 !important;
  float: left;
  display: none;
  min-width: 160px;
  width: 160px;
  padding: 4px 0;
  margin: 2px 0 0 0;
  list-style: none;
  background-color: #ffffff;
  border-color: #ccc;
  border-color: rgba(0, 0, 0, 0.2);
  border-style: solid;
  border-width: 1px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
  *border-right-width: 2px;
  *border-bottom-width: 2px;
}
.ui-menu-item > a.ui-corner-all {
    display: block;
    padding: 3px 15px;
    clear: both;
    font-weight: normal;
    line-height: 18px;
    color: #555555;
    white-space: nowrap;
    text-decoration: none;
}
.ui-state-hover, .ui-state-active {
      color: #ffffff;
      text-decoration: none;
      background-color: #0088cc;
      border-radius: 0px;
      -webkit-border-radius: 0px;
      -moz-border-radius: 0px;
      background-image: none;
}
.table-wrapper
{
    width: 100%;
    height: 300px;
    overflow: auto;
}

table
{
    border: 1px solid black;
    margin-right: 20px;
}

td
{
    width: 20px;
    height: 20px;
    font-size: 17px;
    /*background-color: #ccc;*/
}
.ho:hover {
          background-color: #ffff99;
        }
  /*body {
        font-size: 12px;    
    }
    th { font-size: 12px; }
    td { font-size: 11px; }*/
.productos{
  background-color: #f8f9fa;
}
.highlight_row {
  background-color:  #85c1e9;
}
#tableProdBody{
    font-weight:  bold;
}
.negri{
    font-weight: bold;
}
.sizeInput
{
    font-size:24px;
}
</style>
<div class="content">
    <input type="hidden" id="abierto">
    <div id="installedPrinters">
        <label for="installedPrinterName">Selecciona una impresora:</label>
        <select name="installedPrinterName" id="installedPrinterName"></select>
    </div>
    <!--<br /><br />
    <button type="button" onclick="print();">Print Now...</button>-->
                </div>
            </div>
        <div class="row">
          <input type="hidden" id="idDocumentoH">
            <div class="col-md-3 col-sm-12">
                 <div class="input-group input-group-dynamic mb-4">
                    <!--<label class="form-label">Palacas Vehiculo</label>-->
                    <input type="text" id="placas" class="form-control negri" onclick="modalPlacas();" placeholder="Placas Vehiculo">
                    <input type="hidden" id="placas_id">
                    <!--<input type="text" class="form-control" id="placas_search_" onkeypress="return blockSpecialChar(event)">-->
                </div>
            </div>
            <div class="col-md-3 col-sm-12">
                 <div class="input-group input-group-dynamic mb-4">
                    <!--<label class="form-label">Cliente</label>-->
                    <input type="text" class="form-control negri" id="cliente" placeholder="Cliente">
                    <input type="hidden" class="form-control" id="cliente_id">
                    <input type="hidden" class="form-control" id="calcomania_id">
                    <input type="hidden" class="form-control" id="descuento" value="0">
                    <input type="hidden" clas="form-control" id="caja_id_user">
                </div>
            </div>
            <div class="col-md-2 col-sm-0">
                
                        <button class="btn btn-secondary btn-sm btn-block d-flex align-items-center justify-content-center" onclick="modalGlobal()">Fact.Global</button>
       
            </div>
            <div class="col-md-1 col-sm-0">
                                <br>
                                <button class="btn" onclick="ultimoTicket()" title="Ultimo Ticket">
                    <span class="material-icons">
                        confirmation_number
                    </span>
                </button>
              
            </div>
            <div class="col-md-1 col-sm-3">
                <br>
  <button class="btn" onclick="imprimirCorte()" title="Reimpresion Cortes de Caja">
                    <span class="material-icons">
                        receipt_long
                    </span>
                </button>
            </div>
            <div class="col-md-1 col-sm-3" align="right">
              <br>
              <div class="form-check form-switch">
                                <input type="hidden" id="garantiaLluvia" value="{{ $garantia }}">
                <input class="form-check-input" type="checkbox" id="switchLluvia" onclick="garantiaLLuvia();" {{ $activo }}>
                <label class="form-check-label" for="switchLluvia" title="Garantia de lluvia">
                  <span class="material-icons">
                    umbrella
                  </span>
                </label>
              </div>
            </div>
            <div class="col-md-1 col-sm-3" align="right">
              <br>
                <button class="btn" onclick="muestraProd()" title="Muestra Servicios">
                    <span class="material-icons">
                        menu_open
                    </span>
                </button>
            </div>
        </div>
        <div class="row">
            <div class="col-12 card" id="prodList" style="background-color: #adb5bd;">
              <div class="table-responsive">
                <table class="table table-md mb-0" id="prodListTable">
                    <thead>
                        <tr class="bg-info">
                            <th>Código</th>
                            <th>Descripción</th>
                            <th>Cantidad</th>
                            <th>Precio</th>
                            <th>Total</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody id="tableProdBody" class="text-black">
     
                    </tbody>
                </table>

              </div>
            </div>
            <div class="col-2" id="div3" style="overflow: auto; display: none;">
              @foreach ($productos as $p)
                <div class="row">
                    <div class="card mt-2 card-plain bg-secondary text-white" onclick="agregaProducto('{{ $p->Codigo }}');">
                      <div class="card-body p-2">
                       <p class="mt-2">{{ $p->Descripcion }}</p>
                       <p class="mb-0"><b>Precio:</b> ${{ number_format($p->Precio,2); }}</p>
                       </div>
                    </div>
                </div>
              @endforeach
            </div>
        </div>

        <div class="row">
            <div class="col-md-8 col-sm-12 d-flex align-items-center justify-content-center">
                <div class="row">
                    <div class="col-md-2 col-sm-12">
                        <div class="input-group input-group-sm input-group-outline my-3">
                          
                          <input type="text" class="form-control form-control-sm numeros" id="buscaTicket" placeholder="Recepción">
                        </div>
                    </div>
                    <div class="col-md-10 col-sm-12">
                       <!--<div class="input-group input-group-sm input-group-outline my-3">
                          <label class="form-label">Productos/Servicios</label>
                          <input type="text" class="form-control form-control-sm" id="buscaProducto">
                            Text: <span id="ta-txt"></span><br />
            ID: <span id="ta-id"></span><br />
                        </div>-->
                        <div class="row">
                            <div class="col-md-2 col-sm-6">
                                 <button class="btn btn-secondary btn-sm d-flex align-items-center justify-content-center botClas" onclick="abreServicios();" title="Buscar servicios">F1 Buscar Servicio</button>
                            </div>
                            <div class="col-md-2 col-sm-6">
                                <button class="btn btn-secondary btn-sm d-flex align-items-center justify-content-center botClas" onclick="modalPago()" title="Pagar Venta">F2 Pago&nbsp;&nbsp;<br>&nbsp;</button>
                            </div>
                            <div class="col-md-2 col-sm-6">
                                <button class="btn btn-secondary btn-sm d-flex align-items-center justify-content-center botClas" onclick="modalGenerarDocummentos();" title="Reimpresion y facturacion de Tickets/Facturas">F3 Fact Tick./Reimp.</button>
                            </div>
                            <div class="col-md-2 col-sm-6">
                                 <button class="btn btn-secondary btn-sm d-flex align-items-center justify-content-center botClas" onclick="modalVentas();" title="Listado y cancelacion de Tickets/Facturas">F4 Tick./Fact.</button>
                            </div>
                            <div class="col-md-2 col-sm-6">
                                <button class="btn btn-secondary btn-sm d-flex align-items-center justify-content-center botClas" onclick="limpi();" title="Limpiar interfaz">F7 Limpiar&nbsp;</button>
                            </div>
                            <div class="col-md-2 col-sm-6">
                                <button class="btn btn-secondary btn-sm d-flex align-items-center justify-content-center botClas" onclick="IniMovimientos()" title="Movimientos de Caja">F9 Mov.Caja</button>
                            </div>
                        </div>
                    </div>
                   <!-- <div class="col-md-2 col-sm-6 d-flex align-items-center justify-content-center">
                        <button class="btn btn-secondary btn-sm">Autolavado</button>
                    </div>
                    <div class="col-md-2 col-sm-6 d-flex align-items-center justify-content-center">
                        <button class="btn btn-secondary btn-sm" onclick="modalGlobal();">Fact. Global</button>
                    </div>-->
                </div>
                <!--<div class="row">
                    <div class="col-2">
                        <button class="btn btn-secondary btn-lg d-flex align-items-center justify-content-center" onclick="javascript:$('#modalServicios').modal('show');">F1 Buscar</button>
                    </div>
                    <div class="col-2">
                        <button class="btn btn-secondary btn-lg d-flex align-items-center justify-content-center">Generico</button>
                    </div>
                    <div class="col-2">
                        <button class="btn btn-secondary btn-lg d-flex align-items-center justify-content-center" onclick="IniMovimientos()">F9 Mov.Caja</button>
                    </div>
                    <div class="col-2">
                        <button class="btn btn-secondary btn-lg d-flex align-items-center justify-content-center" onclick="modalVentas();">F4 Ticketss</button>
                    </div>
                    <div class="col-2">
                        <button class="btn btn-secondary btn-lg btn-block d-flex align-items-center justify-content-center" onclick="modalPago()">F2 Pago</button>
                    </div>
                    <div class="col-2">
                        <button class="btn btn-secondary btn-lg d-flex align-items-center justify-content-center" onclick="modalGenerarDocummentos();">F3 Facturar</button>
                    </div>
                    <!--<div class="col-md-2 col-sm-2">
                        <button class="btn btn-secondary btn-sm btn-block" onclick="javascript:$('#modalPago').modal('show')">F2 forma de Pago</button>
                    </div>-->
               <!-- </div>-->
            </div>
            <div class="col-md-4 col-sm-12">
                <div class="card" style="background-color: #dee2e6;">
                    <div class="card-body text-right">
                        <div class="row">
                        <div class="col-6">
                             <h6 class="mb-0 font-weight-bolder">Total:</h6>
                             <h6 class="mb-0 font-weight-bolder">Efectivo:</h6>
                             <h6 class="mb-0 font-weight-bolder">Cambio:</h6>
                        </div>
                        <div class="col-6">
                            <h6 class="mb-0 font-weight-bolder" id="totalOrden">$0.00</h6>
                            <input type="hidden" id="totalOrdenHidden">
                             <h6 class="mb-0 font-weight-bolder">$0.00</h6>
                             <h6 class="mb-0 font-weight-bolder">$0.00</h6>
                        </div>
                    </div>
                    </div>
                </div>
            </div>

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

<div class="modal fade modalEsc" id="modalPlacas">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Vehículos</h4>
                <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-12">
                        <div class="input-group input-group-static">
                            <label>Placas</label>
                            <input type="text" class="form-control" id="placas_search" onkeypress="return blockSpecialChar(event)">
                        </div>
                    </div>
                </div>
                <div class="col-12" align="right">
                    <button class="btn btn-primary" onclick="regVehic();"><i class="fa fa-user-plus" aria-hidden="true"></i>Registra Vehículo</button>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" onclick="cerrarModales();">Cerrar</button>
                <button type="button" class="btn btn-primary" onclick="agregaPlaca();">Aceptar</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade modalEsc" id="modalVehiculo">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header bg-info">
                <h4 class="modal-title">Nuevo Vehículo</h4>
                <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-12">
                        <div class="input-group input-group-static my-3">
                          <label>Placas</label>
                          <input type="text" class="form-control" id="placasModal" style="text-transform:uppercase;" onblur="revisaPlacas();">
                        </div>
                    </div>  
                </div>
                <div class="row">
                    <div class="col-12">
                        <div class="input-group input-group-static my-3">
                          <label>SubMarcas</label>
                          <select id="subMarcaModal" class="form-control select2" onchange="getMarcas();">
                            <option value="0">-Selecciona-</option>
                              @foreach ($submarcas as $marca)
                              <option value="{{ $marca->Id }}" idmarca="{{ $marca->Marca_id }}">{{ $marca->SubMarca }}</option>
                            @endforeach
                          </select>
                        </div>
                    </div>  
                </div>
                <div class="row">
                    <div class="col-12">
                        <div class="input-group input-group-static my-3">
                          <label>Marcas</label>
                          <select id="marcasModal" class="form-control select2">
                            <option value="0">-Selecciona-</option>
                            @foreach ($marcas as $marca)
                              <option value="{{ $marca->Id }}">{{ $marca->Marca }}</option>
                            @endforeach
                          </select>
                        </div>
                    </div>  
                </div>

                <div class="row">
                    <div class="col-12">
                        <div class="input-group input-group-static my-3">
                          <label>Color</label>
                          <select id="colorModal" class="form-control select2">
                            <option value="0">-Selecciona-</option>
                            @foreach ($colores as $color)
                              <option value="{{ $color->Id }}">{{ $color->Color }}</option>
                            @endforeach
                          </select>
                        </div>
                    </div>  
                </div>
                <div class="row">
                    <div class="col-12">
                        <div class="input-group input-group-static my-3">
                          <label>Calcomania</label>
                          <select id="calcomaniaModal" class="form-control select2" onchange="muestaVenciminto();">
                            <option value="0">-Selecciona-</option>
                            @foreach ($calcomanias as $c)
                              <option value="{{ $c->Id }}">{{ $c->Descripcion }}</option>
                            @endforeach
                          </select>
                        </div>
                    </div>  
                </div>
                <div class="row" id="vigenciaCalco" style="display: none;">
                    <div class="col-6">
                        <div class="input-group input-group-static my-3">
                          <label>Fecha</label>
                          <input type="date" class="form-control" id="VenceMembresia">
                        </div>
                    </div>
                    <div class="col-6" id="folCalco">
                         <div class="input-group input-group-static my-3">
                          <label>Folio</label>
                          <input type="input" class="form-control" id="FolioMembresia">
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-12">
                        <div class="input-group input-group-static my-3">
                          <label>Cliente</label>
                          <select id="clienteModal" class="form-control select2">
                            @foreach ($clientes as $Id=>$Nombre)
                              <option value="{{ $Id }}">{{ $Nombre }}</option>
                            @endforeach
                          </select>
                        </div>
                    </div> 
                </div>
                <div class="row">
                    <div class="col-12" align="right">
                         <button class="btn btn-secondary" onclick="modalClienntes();">...</button>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-bs-dismiss="modal">Cerrar</button>
                <button type="button" class="btn btn-primary" onclick="guardarVehiculo();">Guardar</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade modalEsc" id="modalServicios">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Buscar Servicios</h4>
               <!-- <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>-->
            </div>
            <div class="modal-body">
                <div class="col-12">
                    <div class="row">
                        <div class="col-12">
                                              <div class="input-group input-group-outline my-3">
                          
                          <!--<input type="text" id="buscaServicios" class="form-control">-->
                          <input type="text" id="buscaServicios" class="form-control" /><br /><br />
          
                        </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-12">
                            <div class="card card-frame bg-primary">
                              <div class="card-body text-white">
                                Servicio - Codigo
                              </div>
                            </div>
                        </div>
                    </div>  
                    <br>
                    <div class="row" style="overflow: hidden; height: 100%; border: 1px;">
                        <div class="col-6">
<div class="card bg-gray-300">
    <div class="card-body">
                            <select id="seseses" class="form-control chosen-select" size="20" multiple  onclick="try{onclick_(this);agregaProducto(this)}catch(e){}" ondblclick="try{ondblclick_(this);}catch(e){}" onblur="
try{onblur_(this);}catch(e){}" onchange="try{onchange_(this);}catch(e){}" onfocus="try{onfocus_(this);}catch(e){}" onkeydown=";try{onkeydown_(this,event);}catch(e){try{onkeydown_(this);}catch(ee){}}">
                                @foreach ($productos2 as $e)
                                <option value="{{ $e->Codigo }}" desc="{{ $e->Descripcion }}" estatus="{{ $e->Estatus }}">{{ $e->Descripcion }} - ${{ number_format($e->Precio,2) }}</option>
                                @endforeach
                            </select>
    </div>
</div>
                        </div>  
                        <div class="col-6">
                            <div class="card card-frame">
                              <div class="card-body">
                                <ul class="list-group" id="list-groupitems">
                                </ul>
                              </div>
                            </div>


                        </div>  
                        <!--<table class="table child-div" id="tableServicios">
                            <thead>
                                <tr>
                                    <th>Descripcion</th>
                              
                                </tr>
                            </thead>
                            <tbody id="bodyServicios" >
                                
                                    <tr cellpadding='0' cellspacing='0' onclick="agregaProducto(this)" onchange="agregaProducto(this)" class="">
                                        <td>

                                            
                                        </td>
                                       
                                    </tr>
                                
                            </tbody>
                        </table>-->
                    </div>
                </div>
            </div>

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


    <div class="modal fade modalEsc" id="modalGenerico">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">Servicio Generico</h4>
                    <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-6 col-sm-12">
                            <div class="input-group input-group-static my-3">
                              <label>Descripcion</label>
                              <input type="text" class="form-control">
                            </div>
                        </div>
                        <div class="col-md-2 col-sm-6">
                            <div class="input-group input-group-static my-3">
                              <label>Cantidad</label>
                              <input type="text" class="form-control">
                            </div>
                        </div>
                        <div class="col-md-2 col-sm-6">
                            <div class="input-group input-group-static my-3">
                              <label>Precio</label>
                              <input type="text" class="form-control">
                            </div>
                        </div>
                        <div class="col-md-2 col-sm-12">
                            <button class="btn btn-primary">Aceptar</button>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary">Save changes</button>
                </div>
            </div>
        </div>
    </div>


<div class="modal fade modalEsc" id="modalGenerarDocummentos" tabindex="-2">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Generar Documentos</h4>
                <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
            </div>
            <div class="modal-body">
                <div class="row">
                        <div class="col-md-2 col-sm-6">
                                                       <div class="input-group input-group-static my-3">
                              <label>Serie</label>
                              <select class="form-control" id="serieBusca">
                                @foreach ($series as $mp)
                                    <option value="{{ $mp->prefijo->ClavePrefijo }}{{ $mp->Serie2 }}">{{ $mp->prefijo->ClavePrefijo }}{{ $mp->Serie2 }}</option>
                                @endforeach
                              </select>
                            </div>

                        </div>
                        <div class="col-md-2 col-sm-6">
                            <div class="input-group input-group-static my-3">
                              <label>Folio</label>
                              <input type="text" class="form-control" id="folioBusca" placeholder="Folio">
                            </div>
                        </div>
                          <div class="col-md-3 col-sm-6">
                            <div class="input-group input-group-static my-3">
                              <label>Fecha</label>
                              <input type="date" class="form-control datepicker" id="fechaBusca" value="{{ date('Y-m-d') }}">
                            </div>
                        </div>
                        <div class="col-md-3 col-sm-12 align-content-center">
                            <div class="input-group input-group-static my-3">
                                <button class="btn btn-primary" onclick="buscaDocumento();">Buscar</button>
                            </div>
                        </div>
                </div>
                <div class="row">
                    <input type="hidden" id="idDoc_r">
                    <div class="col-md-3">
                        <label>Cliente</label>
                        <input type="text" class="form-control" id="cliente_r" readonly>
                        <input type="hidden" id="idCliente_r">
                    </div>
                    <div class="col-md-1" id="btnVerCambiarCliente" style="display: none;"><br>
                        <div class="d-flex align-items-center">
                            <button class="btn btn-primary" onclick="verClientes();" title="Cambiar Cliente"><i class="fa fa-user" aria-hidden="true"></i></button>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <label>RFC</label>
                        <input type="text" class="form-control" id="rfc_r" readonly>
                    </div>
                    <div class="col-md-4">
                        <label>Total</label>
                        <input type="text" class="form-control" id="total_r" readonly>
                    </div>
                    <input type="hidden" id="urldoc_r">
                    <input type="hidden" id="tipodoc_r">
                </div>
                <div class="row">
                        <div class="col-md-6 col-sm-12">
                            <div class="input-group input-group-static my-3">
                              <label>Uso CFDI</label>
                              <select class="form-control" id="usocfdi_r">
                                @foreach ($usocfdi as $mp)
                                    @if($mp->c_usocfdi=='G03')
                                        <option value="{{ $mp->c_usocfdi }}" selected>{{ $mp->descripcion }}({{ $mp->c_usocfdi }})</option>
                                    @else
                                        <option value="{{ $mp->c_usocfdi }}">{{ $mp->descripcion }}({{ $mp->c_usocfdi }})</option>
                                    @endif
                                @endforeach
                              </select>
                            </div>
                        </div>
                        <div class="col-md-6 col-sm-12">
                            <label>Metodo de Pago</label>
                            <select id="metodoPago_r" class="form-control">
                                @foreach ($metodospago as $mp)
                                    <option value="{{ $mp->clave }}">{{ $mp->descripcion }}({{ $mp->clave }})</option>
                                @endforeach
                            </select>
                        </div>
                </div>
                <div class="form-row btnFact2" align="right">
                        <div class="form-check">
      <label class="form-check-label">
          <input class="form-check-input" type="checkbox" value="" id="concoche2" checked>
          Incluir datos del Vehículo
          <span class="form-check-sign">
            <span class="check"></span>
          </span>
      </label>
    </div>
                </div>
                                 <div class="row">
                        <div class="col-md-4">
                            <div class="input-group input-group-static mb-4">
                                <label>Tipo relacion</label>
                                <select id="tiporelacionRel2" class="form-control" onchange="muestraTableRel(2);">
                                    <option value="0">-Selecciones-</option>
                                    @foreach ($relaciones as $mp)
                                        <option value="{{ $mp->c_tiporelacion }}">{{ $mp->descripcion }}({{ $mp->c_tiporelacion }})</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-6 relacionFuncion" style="display: none;">
                            <div class="row">
                                <div class="col-6">
                                    <div class="input-group input-group-static mb-4">
                                        <label>Serie</label>
                                        <input type="text" class="form-control" id="serieRel2">
                                    </div>
                                </div>
                                <div class="col-6">
                                    <div class="input-group input-group-static mb-4">
                                        <label>Folio</label>
                                        <input type="text" class="form-control" id="folioRel2">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-2 d-flex align-items-center justify-content-center relacionFuncion" style="display: none;">
                            <div class="input-group input-group-static mb-4 relacionFuncion" style="display: none;">
                                <button class="btn btn-primary btn-sm relacionFuncion" onclick="agregaFactura(2);" style="display: none;">
                                    <span class="material-icons">
                                        add
                                    </span>
                                </button>
                            </div>
                        </div>    
                    </div>
                    <div class="row relacionFuncion" style="display: none;">
                        <div class="col-md-12 col-sm-12">
                            <div class="table-responsive">
                                <table class="table table-hover">
                                    <thead>
                                        <tr>
                                            <th>Serie Folio</th>
                                            <th>UUID</th>
                                            <th></th>
                                        </tr>
                                    </thead>
                                    <tbody id="tbodyRelaFacturas2">
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" onclick="reimprime();">Re imprime/Re Envia</button>
                <button type="button" class="btn btn-primary btnFact2" id="btnFact2" style="display: none;">Generar Factura</button>
            </div>
        </div>
    </div>
</div>



<div class="modal fade modalEsc" id="modalPago">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        
        <h4 class="modal-title">Formas de pago</h4>
        <!--<button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>-->
      </div>
      <div class="modal-body">
        <div class="row">
        <div class="col-6">
          @foreach ($fp as $f)
          <div class="row">
            <div class="input-group input-group-static input-group-sm">
                <h4>{{ $f->nombre }}</h4>
                <!--<input type="text" class="form-control inputFP eventfp" id="fpp_{{ $f->id }}" id_bd="{{ $f->id }}" onclick="totalFPinput({{ $f->id }});" onkeyup="calculaCambio();" clave="{{ $f->claveSat }}">-->
                @if ($f->claveSat=='99')
                    <input type="text" class="form-control inputFP eventfp escredito" style="font-size: 25px;" id="fpp_{{ $f->id }}" id_bd="{{ $f->id }}" clave="{{ $f->claveSat }}">
                @else
                    <input type="text" class="form-control inputFP eventfp noescredito" style="font-size: 25px;" id="fpp_{{ $f->id }}" id_bd="{{ $f->id }}" clave="{{ $f->claveSat }}">
                @endif
                
            </div>
          </div>    
          <!--<div class="row">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>{{ $f->nombre }}</label>
              <input type="text" class="form-control inputFP" id="pagoTC" id_bd="{{ $f->id }}">
            </div>
          </div>-->
          @endforeach
         <!-- <div class="row">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>T.Credito</label>
              <input type="text" class="form-control inputFP" id="pagoTC" id_bd="3">
            </div>
          </div>
          <div class="row">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Trasnferencia</label>
              <input type="text" class="form-control inputFP" id="pagoTrans" id_bd="8">
            </div>
          </div>
          <div class="row"> 
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Cheque</label>
              <input type="text" class="form-control inputFP" id="pagoCheque" id_bd="2">
            </div>
          </div>
          <div class="row">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Efectivo</label>
              <input type="text" class="form-control inputFP" id="pagoEfectivo" id_bd="1">
            </div>
          </div>
          <div class="row">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Cortesia</label>
              <input type="text" class="form-control inputFP" id="pagoCortesia" id_bd="6">
            </div>
          </div>
          <div class="row">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Vale</label>
              <input type="text" class="form-control inputFP" id="pagoVale" id_bd="5">
            </div>
          </div>          
          <div class="row">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Credito</label>
              <input type="text" class="form-control inputFP" id="pagoCredito" id_bd="7">
            </div>
          </div>-->
        </div>
        <div class="col-6 text-right">
          <div class="row">
            <div class="input-group input-group-sm input-group-static my-3" style="display: none;">
              <label>Total</label>
              <input type="text" class="form-control" id="totalPago" readonly>
            </div>
            <h2 id="totalPagoLabel">Total : $1,858.495</h2>
          </div>
          <div class="row">
            <div class="input-group input-group-sm input-group-static my-3" style="display: none;">
              <label>Pagado</label>
              <input type="text" class="form-control" id="pagado" value='0' readonly>
            </div>
            <h2 id="pagadoLabel">Pagado : $1,858.495</h2>
          </div>          
          <div class="row">
            <div class="input-group input-group-sm input-group-static my-3" style="display: none;">
              <label>Cambio</label>
              <input type="text" class="form-control" id="cambio" value="0" readonly>
            </div>
            <h2 id="cambioLabel">Cambio : $1,858.495</h2>
          </div>
          <div class="row" id="plazosVenta" style="display: none;">
            <div class="input-group input-group-sm input-group-static my-3">
              <h4>Plazo Venta</h4>
              <select class="form-control" id="plazoVenta" style="font-size: 25px;" onchange="liberaFormas();">
                  @foreach ($plazos as $p)
                      <option value="{{ $p->Id }}">{{ $p->Descripcion }}</option>
                  @endforeach
              </select>
            </div>
          </div>
        </div>
      </div>
      </div>
      <div class="modal-footer">
        
        <button type="button" class="btn btn-success" onclick="pagar();" id="btnPaga">Pagar</button>
      </div>
    </div>
  </div>
</div>


<div class="modal fade modalEsc" id="modalAltaCliente" style="z-index: 1052;">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <input type="hidden" id="tipoAltaCliente">
        <h4 class="modal-title">Nuevo Cliente</h4>
        <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
      </div>
      <div class="modal-body">
        <!--<div class="row">
          <div class="col-md-3 col-sm-12">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Cuenta</label>
              <input type="text" class="form-control" id="cuentaCliente" value='{{ $ultima_cuenta }}'>
            </div>
          </div>
        </div>-->
        <div class="row">
          <div class="col-md-8 col-sm-12">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Nombre<span class="text-danger">*</span></label>
              <input type="text" class="form-control" id="nombreCliente">
            </div>
          </div>
          <div class="col-md-4 col-sm-12">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>RFC</label>
              <input type="text" class="form-control" id="rfcCliente" style="text-transform:uppercase;">
            </div>
          </div>
        </div>
        <div class="row">
            <div class="col-md-12 col-sm-12">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Regimen Fiscal</label>
                <select id="regimenCliente" class="form-control">
                    <option value="0">-Selecciona-</option>
                        @foreach ($regimenes as $f)
                        <option value="{{ $f->id }}">{{ $f->descripcion }}({{ $f->c_regimenfiscal }})</option>
                        @endforeach
                </select>
            </div>                
            </div>
        </div>
        <div class="row">
          <div class="col-md-8 col-sm-8">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Domicilio<span class="text-danger">*</span></label>
              <input type="text" class="form-control" id="domicilioCliente">
            </div>
          </div>
          <div class="col-md-2 col-sm-2">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Num Ext.<span class="text-danger">*</span></label>
              <input type="text" class="form-control" id="numExtCliente">
            </div>
          </div>
            <div class="col-md-2 col-sm-2">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Num Int.</label>
              <input type="text" class="form-control" id="numIntCliente">
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-md-2 col-sm-2">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>CP<span class="text-danger">*</span></label>
              <input type="text" class="form-control" id="cpCliente"  onblur="getColoniasPos();">
            </div>
          </div>
          <div class="col-md-9 col-sm-11">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Colonia<span class="text-danger">*</span></label>
                                 <select id="coloniaCliente" class="form-control">
                            <option value="0">-Selecciona-</option>
                  
                          </select>
            </div>
          </div>
          <div class="col-md-1 d-flex align-items-center justify-content-center">
              <button type="btn-success" id="addC"><i class="fa fa-plus"></i></button>
          </div>
        </div>
        <div class="row">
          <div class="col-md-6 col-sm-12">
            <div class="input-group input-group-sm input-group-static my-3" id="correoClienteDiv">
              <label>Correo</label>
              <input type="email" class="form-control" id="correoCliente" onkeyup="validarEmail();">
            </div>
          </div>
          <div class="col-md-6 col-sm-12">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Telefono</label>
              <input type="text" class="form-control" id="telefonoCliente">
            </div>
          </div>
        </div>  
        <div class="row" style="display: none;">
          <div class="col-md-4 col-sm-4">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Forma de Pago</label>
                  <select id="fpCliente" class="form-control">
                            <option value="0">-Selecciona-</option>
                            @foreach ($fp as $f)
                              <option value="{{ $f->id }}">{{ $f->nombre }}({{ $f->claveSat }})</option>
                            @endforeach
                          </select>
            </div>
          </div>
          <div class="col-md-4 col-sm-4">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Banco</label>
              <input type="text" class="form-control" id="bancoCliente">
            </div>
          </div>
          <div class="col-md-4 col-sm-4">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Num.CTA.</label>
              <input type="text" class="form-control" id="numctaCliente">
            </div>
          </div>
        </div>   
        <!--<div class="row">
          <div class="col-md-6 col-sm-12">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Banco</label>
              <input type="text" class="form-control" id="bancoCliente">
            </div>
          </div>
          <div class="col-md-6 col-sm-12">
            <div class="input-group input-group-sm input-group-static my-3">
              <label>Num.CTA.</label>
              <input type="text" class="form-control" id="numctaCliente">
            </div>
          </div>
        </div>   -->
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-bs-dismiss="modal">Cerrar</button>
        <button type="button" class="btn btn-primary" onclick="guardaCliente();">Guardar</button>
      </div>
    </div>
  </div>
</div>


<div class="modal fade modalEsc" id="modalCargando" tabindex="-1" role="dialog" data-backdrop="static">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        
        <h4 class="modal-title">Cargando...</h4>
        <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
      </div>
      <div class="modal-body">
            <div class="py-3 text-center">
              <div class="spinner-border" role="status">
  <span class="sr-only">Loading...</span>
</div>
              <h4 class="text-gradient text-info mt-4">Cargando...</h4>
             
            </div>
      </div>
      <!--<div class="modal-footer">
        <button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>-->
    </div>
  </div>
</div>



<div class="modal fade modalEsc" id="modalFactGlobal">
  <div class="modal-dialog modal-xl">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">Facturacion Global</h4>
        <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
      </div>
      <div class="modal-body">
        <div class="col-12">
          <div class="row">
            <div class="col-12">
                <div class="input-group input-group-static mb-4">
                  <label>Sucursal</label>
                  <input type="text" class="form-control" id="sucursalGlobal" readonly>
                </div>
            </div>
         <!--<div class="col-6">
                  <div class="input-group input-group-outline my-3">
      <label class="form-label">Folio</label>
      <input type="text" class="form-control">
    </div>
            </div>-->
          </div>
          <div class="row">
         
            <div class="col-12">
              <div class="input-group input-group-static my-3">
                <label>Fecha</label>
                <input type="date" id="desdeGlobal" class="form-control" onchange="buscaVentas();" value="{{ date('Y-m-d') }}">
              </div>
            </div>
         
            <!--<div class="input-group input-group-static mb-4">
               <label for="caja_inicio" class="ms-0">Periodicidad</label>
               <select class="form-control" id="desde">
                @for ($i = 1; $i < $filtroPeriorcidad; $i++)
                  <option value="{{ $i }}">{{ $i }}</option>
                @endfor
               </select>
             </div> -->
         
          </div>
          <div class="row">
            <div class="col-12">
              <h4>Lista de Tickets</h4>
            </div>
          </div>
          <div class="row">
            <div class="col-12">
              <div class="table-wrapper">
                <table class="table table-bordered table-inverse table-hover">
                  <thead>
                    <tr>
                      <!--<th>Sucursal</th>-->
                      <th>Folio</th>
                      <th>Global</th>
                      <th>Tipo</th>
                      <th>Cliente</th>
                      <th>Fecha/hora</th>
                      <th>Importe</th>
                      <th><input class="form-check-input" type="checkbox" value="" onclick="aaa2();" id="todoCheck"></th>
                    </tr>
                  </thead>
                  <tbody id="bodyTableV">
                  </tbody>
                </table>
              </div>
            </div>
          </div>
          <!--<div class="row">
            <div class="col-8"></div>
            <div class="col-4" align="right">
                 <div class="input-group input-group-outline my-3">
      <label class="form-label">Total</label>
      <input type="text" class="form-control">
    </div>
            </div>
          </div>-->
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" onclick="facturaGlobalModal();">Generar</button>
      </div>
    </div>
  </div>
</div>

<!--<a class="btn btn-primary" data-toggle="modal" href='#modalInicioCaja'>Trigger modal</a>-->
<!--<div class="modal fade" id="modalInicioCaja" tabindex="-1" data-bs-backdrop="static" data-bs-keyboard="false">-->
<div class="modal fade" id="modalInicioCaja" tabindex="-1">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">Inicio de Caja</h4>
        <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
      </div>
      <div class="modal-body">
        <div class="row">
          <div class="col-4">
            <div class="input-group input-group-static mb-4">
              <label>Sucursal</label>
              <input type="text" class="form-control" id="sucursal_inicio" readonly>
            </div>
          </div>
          <div class="col-4">
            <div class="input-group input-group-static mb-4">
               <label for="caja_inicio" class="ms-0">Caja</label>
               <select class="form-control" id="caja_inicio">
                <option value="0">-Selecciona Caja-</option>
                @foreach ($cajas as $c)
                  <option value="{{ $c->Id }}">{{ $c->Caja }}</option>
                @endforeach
               </select>
             </div>         
          </div>
          <div class="col-4">
            <div class="input-group input-group-static mb-4">
              <label>Cajero</label>
              <input type="text" class="form-control" id="cajero_inicio" value="{{ auth()->user()->name }}" readonly>
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-12">
            <h4>Valores de Inicio</h4>
            <hr>
          </div>
        </div>
        <div class="row">
          @foreach ($fp as $f)
            <div class="col-4">
              <div class="input-group input-group-static mb-4">
                <label>{{ $f->nombre }}</label>
                <input type="text" class="form-control fp_init" id="fp_{{ $f->id }}" idFp="{{ $f->id }}">
              </div>
            </div>
          @endforeach
        </div>
      </div>
      <div class="modal-footer">
        <!--<button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>-->
        <button type="button" class="btn btn-primary" id="iniciarcaja">Iniciar Caja</button>
      </div>
    </div>
  </div>
</div>

<!--<a class="btn btn-primary" data-toggle="modal" href='#modalMovimientos'>Trigger modal</a>-->
<div class="modal fade modalEsc" id="modalMovimientos">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">

        <h4 class="modal-title">Movimientos Caja</h4>
                <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
          <span class="sr-only">Close</span>
        </button>
      </div>
      <div class="modal-body">
       <div class="row">
         <div class="col-12">
            <div class="input-group input-group-static mb-4">
              <label>Cajero</label>
              <input type="text" class="form-control form-control-sm" id="cajero_movimientos" value="{{ auth()->user()->name }}" readonly>
            </div>
         </div>
       </div>
       <div class="row">
        <div class="col-6">
              <div class="input-group input-group-static mb-4">
                <label>Fecha</label>
                <input type="date" class="form-control form-control-sm" id="fecha_movimientos" value="{{ date('Y-m-d') }}" readonly>
              </div>
         </div>
         <div class="col-6">

            <div class="input-group input-group-static mb-4">
              <label>Caja</label>
              <input type="text" class="form-control form-control-sm" id="caja_movimientos_display" readonly>
               <input type="hidden" class="form-control form-control-sm" id="caja_movimientos">
            </div>
               <!--<label for="caja_inicio" class="ms-0">Caja</label>
               <select class="form-control form-control-sm" id="caja_movimientos" readonly>
                <option value="0">-[Seleccione]-</option>
                @foreach ($cajas as $c)
                  <option value="{{ $c->Id }}">{{ $c->Caja }}</option>
                @endforeach
               </select>-->

         </div>  
       </div>
       <div class="row">
         <div class="col-6">
            <div class="input-group input-group-static mb-4">
               <label for="caja_inicio" class="ms-0">Tipo de Movimiento</label>
               <select class="form-control form-control-sm" id="tipo_movimientos">
                <option value="0">-[Seleccione]-</option>
                @foreach ($tiposMovimientos as $c)
                  <option value="{{ $c->Id }}">{{ $c->TipoMovimientoCaja }}</option>
                @endforeach
               </select>
            </div>            
         </div>
         <div class="col-6">
            <div class="input-group input-group-static mb-4">
              <label>Importe</label>
              <input type="text" class="form-control form-control-sm" id="importe_movimientos">
            </div>
         </div>
       </div>
       <div class="row">
         <div class="col-12">
           <h5>Detalles de valores</h5>
         </div>
       </div>
       <div class="row">
         <div class="col-12">
          <div class="table-responsive">
            <table class="table table-bordered table-sm">
              <thead>
                <tr>
                  <th>Valor</th>
                  <th>Importe</th>
                  <th>Observaciones</th>
                </tr>
              </thead>
              <tbody>
                @foreach ($fp as $f)
                <tr id="fpM_{{ $f->id }}" class="fpm" fpId="{{ $f->id }}">
                  <td>{{ $f->nombre }}</td>
                  <td>
                    <div class="input-group input-group-outline">
                      <input type="text" class="form-control form-control-sm fpm_input" id="importe_{{ $f->id }}">
                    </div>
                  </td>
                  <td>
                    <div class="input-group input-group-outline">
                      <input type="text" class="form-control form-control-sm fpm_input" id="obser_{{ $f->id }}">
                    </div>
                  </td>
                </tr>
                @endforeach
              </tbody>
            </table>
          </div>
         </div>
       </div>
       <div class="row">
         <div class="col-6"></div>
         <div class="col-3">
            <div class="input-group input-group-outline">
              <label id='Ltotal_movimientos'>Total: $0.00</label>
              <input type="hidden" class="form-control form-control-sm" id="total_movimientos">
            </div>
         </div>
         <div class="col-3">
            <div class="input-group input-group-outline">
              <label id="Ldif_movimientos">Diferencia: $0.00</label>
              <input type="hidden" class="form-control form-control-sm" id="dif_movimientos">
            </div>           
         </div>
       </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" onclick="cerrarModales();">Cerrar</button>
        <button type="button" class="btn btn-primary" id="btnGM" onclick="guardarMovimiento();">Guardar</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->


    <div id='modalComprobante' class="modal fade modalEsc" tabindex="-1" role="dialog" data-backdrop="static">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">Ticket</h4>
                    <input type="hidden" id="idVentaTicket">
                </div>
                <div class="modal-body">
                    <div class="row rTouch">
                        <div class="col-md-12">
                            <iframe id="frameComprobante" src="" frameborder="0" style="float:left;height:300px;width:100%;"></iframe>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    
                        <button class="btn btn-success btn-block" onclick="modalFactura();" id="facTicompo">Facturar</button>
                      
                      
                        <button class="btn btn-warning btn-block" onclick="cerrarModales();" id="onCer">Cerrar</button>
                      
                    
                    
                </div>
            </div>
        </div>
    </div>

    <div id='modalComprobanteFact' class="modal fade modalEsc" tabindex="-1" role="dialog" data-backdrop="static">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">Factura</h4>
                    <input type="hidden" id="idDocComprobante">
                    <input type="hidden" id="reenvio">
                </div>
                <div class="modal-body">
                    <div class="row rTouch">
                        <div class="col-md-12">
                            <iframe id="frameComprobanteFact" src="" frameborder="0" style="float:left;height:300px;width:100%;"></iframe>
                        </div>
                    </div>

                </div>
                <div class="modal-footer">
                        <div class="col-4">
                            <div class="input-group input-group-static mb-4">
                              <label>Correo Cliente</label>
                              <!--<input type="text" class="form-control" id="emailClienteM">-->
                              <select id="emailClienteM" class="form-control" id="" multiple="">
                              </select>
                            </div>
                        </div>
                        <div class="col-1 justify-content-center" >
                            <button class="btn btn-primary" onclick="addCorreoCliente();">+</button>
                        </div>
                        <div class="col-3 justify-content-center" >
                            <button class="btn btn-primary btn-block" onclick="enviarFactura();"> Enviar</button>
                        </div>
                        <div class="col-3">
                            <button class="btn btn-warning btn-block" data-bs-dismiss="modal" onclick="cerramodalfacturapdf();">Cerrar</button>
                        </div>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade modalEsc" id="modalFactura">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">Facturar</h4>
                    <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>        
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-5">
                            <div class="input-group input-group-static mb-4">
                                <label>Razon Social</label>
                                <input type="text" class="form-control" id="razSocial_mdf" readonly>
                                <input type="hidden" id="idcliente_mdf">
                            </div>
                        </div>
                        <div class="col-5">
                            <div class="input-group input-group-static mb-4">
                                <label>Razon Social</label>
                                <input type="text" class="form-control" id="rfc_mdf" readonly>
                            </div>
                        </div>
                        <div class="col-2">
                            <button class="btn btn-primary btn-sm" onclick="verClientes(1)">Ca</button>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-6">
                            <div class="input-group input-group-static mb-4">
                                <label>Uso CFDI</label>
                                <select id="usoCfdi" class="form-control">
                                    @foreach ($usocfdi as $mp)
                                        @if($mp->c_usocfdi=='G03')
                                            <option value="{{ $mp->c_usocfdi }}" selected>{{ $mp->descripcion }}({{ $mp->c_usocfdi }})</option>
                                        @else
                                            <option value="{{ $mp->c_usocfdi }}">{{ $mp->descripcion }}({{ $mp->c_usocfdi }})</option>
                                        @endif
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="input-group input-group-static mb-4">
                                <label>Metodo de Pago</label>
                                <select id="metodoPago" class="form-control">
                                    @foreach ($metodospago as $mp)
                                        <option value="{{ $mp->clave }}">{{ $mp->descripcion }}({{ $mp->clave }})</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                    </div>

                    <div class="form-row" align="right">
                        <div class="form-check">
                          <label class="form-check-label">
                              <input class="form-check-input" type="checkbox" value="" id="datosCoche" checked>
                              Incluir datos del Vehículo
                              <span class="form-check-sign">
                                <span class="check"></span>
                              </span>
                          </label>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-4">
                            <div class="input-group input-group-static mb-4">
                                <label>Tipo relacion</label>
                                <select id="tiporelacionRel" class="form-control" onchange="muestraTableRel();">
                                    <option value="0">-Selecciones-</option>
                                    @foreach ($relaciones as $mp)
                                        <option value="{{ $mp->c_tiporelacion }}">{{ $mp->descripcion }}({{ $mp->c_tiporelacion }})</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-6 relacionFuncion" style="display: none;">
                            <div class="row">
                                <div class="col-6">
                                    <div class="input-group input-group-static mb-4">
                                        <label>Serie</label>
                                        <input type="text" class="form-control" id="serieRel">
                                    </div>
                                </div>
                                <div class="col-6">
                                    <div class="input-group input-group-static mb-4">
                                        <label>Folio</label>
                                        <input type="text" class="form-control" id="folioRel">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-2 d-flex align-items-center justify-content-center relacionFuncion" style="display: none;">
                            <div class="input-group input-group-static mb-4 relacionFuncion" style="display: none;">
                                <button class="btn btn-primary btn-sm relacionFuncion" onclick="agregaFactura();" style="display: none;">
                                    <span class="material-icons">
                                        add
                                    </span>
                                </button>
                            </div>
                        </div>    
                    </div>
                    <div class="row relacionFuncion" style="display: none;">
                        <div class="col-md-12 col-sm-12">
                            <div class="table-responsive">
                                <table class="table table-hover">
                                    <thead>
                                        <tr>
                                            <th>Serie Folio</th>
                                            <th>UUID</th>
                                            <th></th>
                                        </tr>
                                    </thead>
                                    <tbody id="tbodyRelaFacturas">
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-bs-dismiss="modal">Cerrar</button>
                    <button type="button" class="btn btn-primary" id="btnFactMain">Facturar</button>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade modalEsc" id="modalVentas">
        <div class="modal-dialog modal-xl">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">Tickets/Facturas</h4>
                    <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
                </div>
                <div class="modal-body">
                    <div class="row">
                        
                    </div>
                    <div class="row">
                        <div class="col-md-4 col-sm-12">
                            <label>Tipo</label>
                            <select id="tipoDcumentoFiltro" class="form-control" onchange="buscaVentasV()">
                                <option value="0">Todos</option>
                                <option value="2">Ticket</option>
                                <option value="1">Factura</option>
                            </select>
                        </div>
                        <div class="col-md-4 col-sm-6">
                          <div class="input-group input-group-static my-3">
                            <label>Desde</label>
                            <input type="date" id="desdeV" class="form-control" onchange="buscaVentasV();" value="{{ date('Y-m-d') }}">
                          </div>
                        </div>
                        <div class="col-md-4 col-sm-6">
                          <div class="input-group input-group-static my-3">
                            <label>Hasta</label>
                            <input type="date" id="hastaV" class="form-control" onchange="buscaVentasV();" value="{{ date('Y-m-d') }}">
                          </div>                            
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-12">
                                <div class="table-responsive">
                                    <table class="table table-bordered">
                                      <thead class="thead-light">
                                        <tr>
                                          <th scope="col">#</th>
                                          <th scope="col">Cliente</th>
                                          <th scope="col">Placas</th>
                                          <th scope="col">Total</th>
                                          <th scope="col">Fecha</th>
                                          <th scope="col">Relacion</th>
                                          <th scope="col">Estatus</th>
                                          <th scope="col">Acciones</th>
                                        </tr>
                                      </thead>
                                      <tbody id="tableBodyVentas">
                                      </tbody>
                                    </table>
                                </div>
                            
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-bs-dismiss="modal" onclick="javascript: $('.modal').modal('hide')">Cerrar</button>
                    <!--<button type="button" class="btn btn-primary">Save changes</button>-->
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade modalEsc" id="modalCancelacionFactura">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">Cancelacion Factura</h4>
                    <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
                </div>
                <div class="modal-body">
                    <input type="hidden" id="idDocHv">
                    <div class="row">
                        <div class="col-12">
                            <div class="input-group input-group-static mb-4">
                               <label for="motivo_cancelacion" class="ms-0">Tipo de Movimiento</label>
                               <select class="form-control form-control-sm" id="motivo_cancelacion" onchange="muestraRel();">
                                    <option value="01">(01) Comprobantes emitidos con errores con relación</option>
                                    <option value="02">(02) Comprobantes emitidos con errores sin relación</option>
                                    <option value="03" selected>(03) No se llevó a cabo la operación</option>
                                    <option value="04">(04) Operación nominativa relacionada en una factura global</option>
                                </select>
                            </div>
                        </div>
                    </div>  
                    <div class="row" id="uuidRelaCancelRow" style="display: none;">
                        <div class="col-6">
                            <label>Serie</label>
                            <input type="text" class="form-control form-control-sm" id="serieRelaCancel">
                        </div>
                        <div class="col-6">
                            <label>Folio</label>
                             <input type="text" class="form-control form-control-sm" id="folioRelaCancel">
                        </div>
                    </div>    
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-bs-dismiss="modal">Cerrar</button>
                    <button type="button" class="btn btn-danger" onclick="cancelaDocumento();">Cancelar</button>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade modalEsc" id="modalServicioEspecial">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">Servicio Especial</h4>
                    <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
                    <input type="hidden" id="servicioEspecialId">
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-6 col-sm-12">
                            <label>Nombre</label>
                            <div class="input-group input-group-dynamic mb-4">
                              <input type="text" id="nomGenerico" class="form-control" aria-label="Amount (to the nearest dollar)">
                            </div>
                        </div>
                        <div class="col-md-6 col-sm-12">
                            <label>Precio</label>
                            <div class="input-group input-group-dynamic mb-4">
                                <span class="input-group-text">$</span>
                                <input type="text" id="precioGenerico" class="form-control" aria-label="Amount (to the nearest dollar)">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <!--<button type="button" class="btn btn-default" data-bs-dismiss="modal">Cerrar</button>-->
                    <button type="button" class="btn btn-primary" onclick="addproductoGenerico();">Agregar</button>
                </div>
            </div>
        </div>
    </div>


<div class="modal fade" id="getCorteModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Corte de Caja</h4>
                <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
                <input type="hidden" id="idPerfil" value="{{ auth()->user()->id_perfil }}">
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-12">
                        <div class="input-group input-group-static my-3">
                            <label>Fecha</label>
                            <input type="date" id="diaCorte" class="form-control" value="{{ date('Y-m-d') }}">
                        </div>
                    </div>
                    <div class="col-md-12">
                         <div class="input-group input-group-static my-3">
                            <label>Usuario</label>
                            <select class="form-control" id="userCorte" @if(auth()->user()->id_perfil!=1 || auth()->user()->id_perfil!=5) readonly @endif>
                                @foreach ($users as $u)
                                    @if(auth()->user()->id_perfil==1 || auth()->user()->id_perfil==5)
                                        <option value="{{ $u->id }}">{{ $u->name }}</option>
                                    @else
                                        @if($u->id==auth()->user()->id)
                                        <option value="{{ $u->id }}" selected>{{ $u->name }}</option>
                                        @else
                                        <option value="{{ $u->id }}">{{ $u->name }}</option>
                                        @endif 
                                    @endif    
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="col-md-12">
                         <div class="input-group input-group-static my-3">
                            <label>Sucursal</label>
                            <select class="form-control" id="sucursalCorte" onchange="getCajas();" @if(auth()->user()->id_perfil!=1 || auth()->user()->id_perfil!=5) readonly @endif>
                                <option value="0">-Selecciona-</option>
                                @foreach ($sucursales as $s)
                                @if(auth()->user()->id_perfil==1 || auth()->user()->id_perfil==5)
                                    <option value="{{ $s->Id }}">{{ $s->Descripcion }}</option>
                                @else
                                        @if($u->id==auth()->user()->id_sucursal)
                                        <option value="{{ $s->Id }}" selected>{{ $s->Descripcion }}</option>
                                        @else
                                        <option value="{{ $s->Id }}">{{ $s->Descripcion }}</option>
                                        @endif 
                                @endif 
                                @endforeach
                            </select>
                        </div>
                    </div>
                     <div class="col-md-12">
                         <div class="input-group input-group-static my-3">
                            <label>Caja</label>
                            <select class="form-control" id="cajasCorte"></select>
                        </div>
                    </div>
                    <!--<div class="col-md-6">
                        <div class="input-group input-group-static my-3">
                            <label>Fecha</label>
                            <input type="date" id="desde" class="form-control" onchange="buscaVentas();" value="{{ date('Y-m-d') }}">
                        </div>
                    </div>-->
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-bs-dismiss="modal">Cerrar</button>
                <button type="button" class="btn btn-primary" onclick="printCorte();">Imprimir</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="modalNuevoEmail">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">Nuevo Correo Cliente</h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-12">
                        <div class="input-group input-group-static my-3">
                            <label>Correo</label>
                            <input type="text" class="form-control" id="correoNuevo">
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-bs-dismiss="modal">Cerrar</button>
                <button type="button" class="btn btn-primary" onclick="guardaCorreoCliente();">Guardar</button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="modalAjustes999">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Ajuste Automóvil</h4>
                <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
                <input type="hidden" id="idCocheHiden">
            </div>
            <div class="modal-body">
                <div class="row">
                <div class="col-md-12">
                        <div class="input-group input-group-static my-3">
                          <label>Sub-marca:</label>
                          <select id="SubMarca_" class="form-control" onchange="selectMarca(this.value)">
                            <option value="0">-Selecciona-</option>
                            @foreach ($submarcas as $sm)
                            <option value="{{$sm->Id}}" Marca_id="{{$sm->Marca_id}}">{{$sm->SubMarca}}</option>
                            @endforeach
                          </select>
                        </div>
                    <!--<div class="input-group input-group-static my-3">
                        <label>Sub-marca:</label>
                        <select class="select2" id="SubMarca_" onchange="selectMarca(this.value)">
                            <option value="0" selected>-[Seleccione una opción]-</option>
                            @foreach ($submarcas as $sm)
                            <option value="{{$sm->Id}}" Marca_id="{{$sm->Marca_id}}">{{$sm->SubMarca}}</option>
                            @endforeach
                        </select>
                    </div>-->
                </div>
                </div>
                <div class="row">
                <div class="col-md-12">
                        <div class="input-group input-group-static my-3">
                          <label>Marcas</label>
                          <select id="Marca_id" class="form-control" onchange="getSubMarca2();" disabled="true">
                            <option value="0">-Selecciona-</option>
                            @foreach ($marcas as $marca)
                              <option value="{{ $marca->Id }}">{{ $marca->Marca }}</option>
                            @endforeach
                          </select>
                        </div>
                   <!-- <div class="input-group input-group-static my-3">
                        <label for="">Marca: </label>
                        <select id="Marca_id" class="select2" data-size="7" data-width="100%" data-live-search="true">
                            <option value="0" selected>-[Seleccione una opción]-</option>
                            @foreach ($marcas as $sm)
                            <option value="{{$sm->Id}}">{{$sm->Marca}}</option>
                            @endforeach
                        </select>
                    </div>-->

                </div>
                </div>
                <div class="row">
                <div class="col-md-12">
                    <div class="input-group input-group-static my-3">
                          <label>Color:</label>
                          <select id="Color_id" class="form-control">
                            <option value="0">-Selecciona-</option>
                            @foreach ($colores as $c)
                            <option value="{{$c->Id}}">{{$c->Color}}</option>
                            @endforeach
                          </select>
                    </div>
                    <!--<div class="input-group input-group-static my-3">
                        <label>Color:</label>
                        <select class="select2" id="Color_id" data-size="7" data-width="100%" data-live-search="true">
                            <option value="0" selected>-[Seleccione una opción]-</option>
                            @foreach ($colores as $c)
                            <option value="{{$c->Id}}">{{$c->Color}}</option>
                            @endforeach
                        </select>
                    </div>-->
                </div>
                </div>
                <div class="row">
                <div class="col-md-12">
                     <div class="input-group input-group-static my-3">
                          <label>Cliente:</label>
                          <select id="Cliente_id2" class="form-control">
                            @foreach ($clientes as $Id=>$Nombre)
                              <option value="{{ $Id }}">{{ $Nombre }}</option>
                            @endforeach
                          </select>
                    </div>
                    <!--<div class="input-group input-group-static my-3">
                        <label>Cliente:</label>
                        <select class="select2" id="Cliente_id" data-size="7" data-width="100%" data-live-search="true">
                            @foreach ($clientes as $Id=>$Nombre)
                              <option value="{{ $Id }}">{{ $Nombre }}</option>
                            @endforeach
                        </select>
                    </div>-->
                </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-bs-dismiss="modal">Cerrar</button>
                <button type="button" class="btn btn-primary" onclick="edita9999();">Guardar</button>
            </div>
        </div>
    </div>
</div>

    <div class="modal fade modalEsc" id="modalFactura2">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">Facturar</h4>
                    <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>        
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-4">
                            <div class="input-group input-group-static mb-4">
                                <label>Tipo relacion</label>
                                <select id="tiporelacionRel3" class="form-control" onchange="muestraTableRel(3);">
                                    <option value="0">-Selecciones-</option>
                                    @foreach ($relaciones as $mp)
                                        <option value="{{ $mp->c_tiporelacion }}">{{ $mp->descripcion }}({{ $mp->c_tiporelacion }})</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-6 relacionFuncion3" style="display: none;">
                            <div class="row">
                                <div class="col-6">
                                    <div class="input-group input-group-static mb-4">
                                        <label>Serie</label>
                                        <input type="text" class="form-control" id="serieRel3">
                                    </div>
                                </div>
                                <div class="col-6">
                                    <div class="input-group input-group-static mb-4">
                                        <label>Folio</label>
                                        <input type="text" class="form-control" id="folioRel3">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-2 d-flex align-items-center justify-content-center relacionFuncion3" style="display: none;">
                            <div class="input-group input-group-static mb-4 relacionFuncion3" style="display: none;">
                                <button class="btn btn-primary btn-sm relacionFuncion3" onclick="agregaFactura(3);" style="display: none;">
                                    <span class="material-icons">
                                        add
                                    </span>
                                </button>
                            </div>
                        </div>    
                    </div>
                    <div class="row relacionFuncion3" style="display: none;">
                        <div class="col-md-12 col-sm-12">
                            <div class="table-responsive">
                                <table class="table table-hover">
                                    <thead>
                                        <tr>
                                            <th>Serie Folio</th>
                                            <th>UUID</th>
                                            <th></th>
                                        </tr>
                                    </thead>
                                    <tbody id="tbodyRelaFacturas3">
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-bs-dismiss="modal">Cerrar</button>
                    <button type="button" class="btn btn-primary" onclick="facturaGlobal();">Facturar</button>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="modalverClientes">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">Cambiar cliente</h4>
                    <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
                    <input type="hidden" id="tipoDeCambiocliente">
                </div>
                <div class="modal-body">
                    <div class="row">
                    <div class="col-11">
                        <div class="input-group input-group-static my-3">
                          <label>Cliente</label>
                          <select id="clienteCambio" class="form-control select2">
                            @foreach ($clientes as $Id=>$Nombre)
                              <option value="{{ $Id }}">{{ $Nombre }}</option>
                            @endforeach
                          </select>
                        </div>
                    </div> 
                    <div class="col-1">
                        <br>
                        <div class="d-flex align-items-center">
                            <button class="btn btn-primary btn-sm" title="Nuevo Cliente" onclick="modalClienntes(1)"><i class="fa fa-user-plus" aria-hidden="true"></i></button>
                        </div>
                    </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary" onclick="cambiaClienteVenta();">Cambiar</button>
                </div>
            </div>
        </div>
    </div>
   <!-- <a class="btn btn-primary" data-toggle="modal" href='#modal-id'>Trigger modal</a>

    <div class="modal fade" id="modal-id" tabindex="-1" role="dialog" data-backdrop="static">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title">Corte de Caja</h4>
                </div>
                <div class="modal-body">
                    
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-bs-dismiss="modal" onclick="cerrarCorte();">Cerrar</button>
                    
                </div>
            </div>
        </div>
    </div>-->
    @include('catalogo.domicilios.domicilios', ['Paises' => $Paises])
</div>
<script src="{{ asset('js/pos/JSPrintManager.js') }}?{{ microtime() }}"></script>
<link rel="stylesheet" href="{{asset('vendor/jquery-ui/jquery-ui.min.css')}}">
<script src="{{asset('vendor/jquery-ui/jquery-ui.min.js')}}"></script>
<script src="{{ asset('js/pos/pos.js') }}?{{ microtime() }}"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.3.5/bluebird.min.js"></script>
<script>

    //WebSocket settings
    JSPM.JSPrintManager.auto_reconnect = true;
    JSPM.JSPrintManager.start();
    JSPM.JSPrintManager.WS.onStatusChanged = function () {
        if (jspmWSStatus()) {
            //get client installed printers
            JSPM.JSPrintManager.getPrinters().then(function (myPrinters) {
                var options = '';
                for (var i = 0; i < myPrinters.length; i++) {
                    if(myPrinters[i]=='EPSON_TM_T88V' || myPrinters[i] == 'T88V'){
                        options += '<option>' + myPrinters[i] + '</option>';
                    }
                }
                $('#installedPrinterName').html(options);
            });
        }
    };

    //Check JSPM WebSocket status
    function jspmWSStatus() {
        if (JSPM.JSPrintManager.websocket_status == JSPM.WSStatus.Open)
            return true;
        else if (JSPM.JSPrintManager.websocket_status == JSPM.WSStatus.Closed) {
            console.log('JSPrintManager (JSPM) is not installed or not running! Download JSPM Client App from https://neodynamic.com/downloads/jspm');
            return false;
        }
        else if (JSPM.JSPrintManager.websocket_status == JSPM.WSStatus.Blocked) {
            console.log('JSPM has blocked this website!');
            return false;
        }
    }

    //Do printing...
    function print(o) {
        if (jspmWSStatus()) {
            //Create a ClientPrintJob
            var cpj = new JSPM.ClientPrintJob();
            //Set Printer type (Refer to the help, there many of them!)

            if ($('#installedPrinterName').val() == '') {
              return;
            } 
            
            cpj.clientPrinter = new JSPM.InstalledPrinter($('#installedPrinterName').val());
            //Set content to print...
            //Create ESP/POS commands for sample label
            var esc = '\x1B'; //ESC byte in hex notation
            var newLine = '\x0A'; //LF byte in hex notation
        
            var cmds = esc + "@"; //Initializes the printer (ESC @)
            cmds += esc + '!' + '\x38'; //Emphasized + Double-height + Double-width mode selected (ESC ! (8 + 16 + 32)) 56 dec => 38 hex
            cmds += 'BEST DEAL STORES'; //text to print
            cmds += newLine + newLine;
            cmds += esc + '!' + '\x00'; //Character font A selected (ESC ! 0)
            cmds += 'COOKIES                   5.00'; 
            cmds += newLine;
            cmds += 'MILK 65 Fl oz             3.78';
            cmds += newLine + newLine;
            cmds += 'SUBTOTAL                  8.78';
            cmds += newLine;
            cmds += 'TAX 5%                    0.44';
            cmds += newLine;
            cmds += 'TOTAL                     9.22';
            cmds += newLine;
            cmds += 'CASH TEND                10.00';
            cmds += newLine;
            cmds += 'CASH DUE                  0.78';
            cmds += newLine + newLine;
            cmds += esc + '!' + '\x18'; //Emphasized + Double-height mode selected (ESC ! (16 + 8)) 24 dec => 18 hex
            cmds += '# ITEMS SOLD 2';
            cmds += esc + '!' + '\x00'; //Character font A selected (ESC ! 0)
            cmds += newLine + newLine;
            cmds += '11/03/13  19:53:17';

            cpj.printerCommands = cmds;
            //Send print job to printer!
            cpj.sendToClient();
        }
    }

    function printticket(zpl) {
        //alert('qa');
        console.log(zpl)
        //alert(zpl)
            zpl = atob(zpl)
           // alert(zpl)
            //alert('aaaa')
            if (jspmWSStatus()) {
            //Create a ClientPrintJob
            var cpj = new JSPM.ClientPrintJob();
            //Set Printer type (Refer to the help, there many of them!)

            if ($('#installedPrinterName').val() == '') {
              return;
            } 
            
            cpj.clientPrinter = new JSPM.InstalledPrinter($('#installedPrinterName').val());

            //Set content to print...
            //Create Zebra ZPL commands for sample label
            /*var cmds =  "^XA";
            cmds += "^FO20,30^GB750,1100,4^FS";
            cmds += "^FO20,30^GB750,200,4^FS";
            cmds += "^FO20,30^GB750,400,4^FS";
            cmds += "^FO20,30^GB750,700,4^FS";
            cmds += "^FO20,226^GB325,204,4^FS";
            cmds += "^FO30,40^ADN,36,20^FDShip to:^FS";
            cmds += "^FO30,260^ADN,18,10^FDPart number #^FS";
            cmds += "^FO360,260^ADN,18,10^FDDescription:^FS";
            cmds += "^FO30,750^ADN,36,20^FDFrom:^FS";
            cmds += "^FO150,125^ADN,36,20^FDAcme Printing^FS";
            cmds += "^FO60,330^ADN,36,20^FD14042^FS";
            cmds += "^FO400,330^ADN,36,20^FDScrew^FS";
            cmds += "^FO70,480^BY4^B3N,,200^FD12345678^FS";
            cmds += "^FO150,800^ADN,36,20^FDMacks Fabricating^FS";
            cmds += "^XZ";*/
            var esc = '\x1B';
            var cmds = esc + "@";
            var stringCode = cmds + zpl;
            cpj.printerCommands = stringCode;
             //cpj.printerCommands = stringCode;
            //Send print job to printer!
            cpj.sendToClient();
        }
    }
</script>


@endsection