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

@section('content')
<style>
  .obli::before {
    content: "* ";
    color: red;
    font-weight: bold;
  }

  /* 
  .ck.ck-editor {
    width: 100%;
  } */
</style>
<div class="content">
  <div class="container-fluid">
    <div class="row">
      <div class="col-md-12">
        <div class="card">
          <div class="card card-nav-tabs card-plain">
            <div class="card-header card-header-primary">
              <h4 class="card-title ">Configuración de empresa</h4>
              <div class="nav-tabs-navigation">
                <div class="nav-tabs-wrapper">
                  <ul class="nav nav-pills nav-pills-primary" role="tablist">
                    <li class="nav-item">
                      <a class="nav-link active" data-toggle="tab" href="#home" role="tablist" aria-expanded="true">
                        Generales
                      </a>
                    </li>
                    <li class="nav-item" onclick="loadGridCorreos()">
                      <a class="nav-link" data-toggle="tab" href="#correos" role="tablist" aria-expanded="false" >
                        Correos
                      </a>
                    </li>
                    <li class="nav-item" onclick="loadGridLeyendas()">
                      <a class="nav-link" data-toggle="tab" href="#ticket" role="tablist" aria-expanded="false" >
                        Leyendas
                      </a>
                    </li>
                    <li class="nav-item" onclick="loadGridPacs()">
                      <a class="nav-link" data-toggle="tab" href="#timbrado" role="tablist" aria-expanded="false" >
                        Pacs timbrado
                      </a>
                    </li>
                  </ul>
                </div>
              </div>
            </div>
            <hr>
            <div class="card-body">
              <div class="tab-content tab-space">
                <div class="tab-pane active" id="home" aria-expanded="true">
                  <h5>Datos generales</h5>
                  <div class="row">
                    <input type="hidden" id="idHidden">
                    <div class="col-md-3">
                      <div class="input-group input-group-static ">
                        <label>Razon Social <span class="text-danger">*</span></label>
                        <input type="text" class="form-control" id="RazonSocial">
                      </div>
                    </div>
                    <div class="col-md-3">
                      <div class="input-group input-group-static ">
                        <label>Nombre Comercial</label>
                        <input type="text" class="form-control" id="NombreComercial">
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>RFC <span class="text-danger">*</span></label>
                        <input type="text" style="text-transform:uppercase" class="form-control" id="Rfc">
                      </div>

                    </div>
                    <div class="col-md-4">
                      <div class="input-group input-group-static ">
                        <label>Regimen fiscal <span class="text-danger">*</span></label>
                        <select class="form-control" id="RegimenFiscal">
                          <option value="0" selected disabled>-[Seleccione una opción]-</option>
                          @foreach ($data['regimenF'] as $regimen)
                          <option value="{{$regimen->id}}" selected>{{$regimen->descripcion}}</option>
                          @endforeach
                        </select>
                      </div>
                    </div>
                  </div>
                  <div class="row">
                    <div class="col-md-3">
                      <div class="input-group input-group-static ">
                        <label>Teléfono<span class="text-danger">*</span> </label>
                        <input type="number" class="form-control" id="Telefono">
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Periodicidad <span class="text-danger">*</span></label>
                        <select class="form-control" id="Periodicidad">
                          <option value="0" selected disabled>-[Seleccione una opción]-</option>
                          @foreach ($data['periocidad'] as $pr)
                          <option value="{{$pr->periocidad}}">{{$pr->periocidad}}</option>
                          @endforeach
                        </select>
                      </div>
                    </div>
                    <div class="col-md-2">
                      <label style="margin-left: 0px;">Garantia de lluvia<span class="text-danger">*</span></label>
                      <div class="form-group">
                        <div class="form-check form-check-inline">
                          <input class="form-check-input" type="radio" name="garantia_lluvia" id="inlineRadio1" value="1" checked onchange="setGarantiaDeLluvia(this.value)">
                          <label class="form-check-label" for="inlineRadio1">Si</label>
                        </div>
                        <div class="form-check form-check-inline">
                          <input class="form-check-input" type="radio" name="garantia_lluvia" id="inlineRadio2" value="0" onchange="setGarantiaDeLluvia(this.value)">
                          <label class="form-check-label" for="inlineRadio2">No</label>
                        </div>
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Color del sistema</label>
                        <select class="form-control" id="TemaPlantilla">
                          <option value="0" selected disabled>-[Seleccione una opción]-</option>
                          <option value="blue">Azul</option>
                          <option value="red">Rojo</option>
                          <option value="gray">Gris</option>
                          <option value="white">Blanco</option>
                          <option value="yellow">Amarillo</option>
                          <option value="green">Verde</option>
                          <option value="black">Negro</option>
                        </select>
                      </div>
                    </div>
                  </div>

                  <div class="row">
                    <div class="col-12" id="contentNormasLluvia" style="display: none;">
                      <div class="input-group input-group-static ">
                        <label>Normas garantia de lluvia <span class="text-danger">*</span></label>
                        <textarea class="form-control" id="garantia_reglas" cols="30" rows="5"></textarea>
                      </div>
                    </div>
                  </div>
                  <hr>
                  <h5>Domicilio</h5>
                  <div class="row">
                    <div class="col-md-4">
                      <div class="input-group input-group-static ">
                        <label>Calle <span class="text-danger">*</span></label>
                        <input type="text" class="form-control" id="Calle">
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Numero exterior <span class="text-danger">*</span></label>
                        <input type="text" class="form-control" id="NumeroExterior">
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Numero interior</label>
                        <input type="text" class="form-control" id="NumeroInterior">
                      </div>
                    </div>


                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Giros <span class="text-danger">*</span></label>
                        <select class="form-control" id="Giros_Id">
                          <option value="0" selected disabled>-[Selecciona una opción]-</option>
                          @foreach(($data['giros']) as $giro)
                          <option value="{{$giro->Id}}">{{$giro->Descripcion}}</option>
                          @endforeach

                        </select>
                      </div>
                    </div>
                    <div class="col-md-2 mt-4">
                      <button class="btn btn-primary form-control " id="addC">Actualizar domicilio</button>
                    </div>
                  </div>
                  <div class="row">
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Colonia <span class="text-danger">*</span></label>
                        <input type="text" id="coloniaV" class="form-control" colonia_id="" disabled>
                      </div>
                      <div class="input-group input-group-static ">
                        <label>C.P <span class="text-danger">*</span></label>
                        <input type="text" id="cpV" class="form-control" disabled>
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Pais <span class="text-danger">*</span></label>
                        <input type="text" id="paisV" class="form-control" disabled>
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Estado <span class="text-danger">*</span></label>
                        <input type="text" id="estadoV" class="form-control" disabled>
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Municipio <span class="text-danger">*</span></label>
                        <input type="text" id="municipioV" class="form-control" disabled>
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Polacion <span class="text-danger">*</span></label>
                        <input type="text" id="poblacionV" class="form-control" disabled>
                      </div>
                    </div>

                  </div>
                  <hr>
                  <h5>Datos de Empresa</h5>
                  <div class="row">
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Cliente InteSysmtem <span class="text-danger">*</span></label>
                        <input type="text" class="form-control" id="ClienteIntesys" />
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Pac timbrado <span class="text-danger">*</span></label>
                        <select class="form-control" id="PacsTimbrado_Id">
                          <option value="0" selected disabled>-[Selecciona una opción]-</option>
                          @foreach(($data['pacstimbrado']) as $pac)
                          <option value="{{$pac->Id}}">{{$pac->PAC}}</option>
                          @endforeach
                        </select>
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Caducida de contraseñas</label>
                        <input type="text" class="form-control" id="CaducidadContrasenas">
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Caducidad de sesión</label>
                        <input type="text" class="form-control" id="TiempoCaducidadSesion">
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Numero de intentos</label>
                        <input type="number" class="form-control" id="NumeroIntentosContrasena">
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Modo mantenimiento <span class="text-danger">*</span></label>
                        <select class="form-control" id="ModoMantenimiento">
                          <option value="0" selected disabled>-[Seleccione una opción]-</option>
                          <option value="DEV">Mantenimiento</option>
                          <option value="PROD">Producción</option>
                        </select>
                      </div>
                    </div>


                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Vigencia CSD desde <span class="text-danger">*</span></label>
                        <input type="text" class="form-control datepicker" name="options" id="VigenciaCSD_Desde">
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Vigencia CSD hasta <span class="text-danger">*</span></label>
                        <input type="text" class="form-control datepicker" name="options" id="VigenciaCSD_Hasta">
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Numero certificado <span class="text-danger">*</span></label>
                        <input type="text" class="form-control" id="NumeroCertificado">
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Llave <span class="text-danger">*</span></label>
                        <input type="text" class="form-control" id="Llave">
                      </div>
                    </div>
                    <form enctype="multipart/form-data" id="formuploadajax" method="post">
                      <div class="row">
                        <div class="col-md-6">
                          <label>Certificado <span class="text-danger">*</span></label>
                          <br>
                          <input type="file" class="form-control-file" id="RutaCertificado" name="cer">
                          <br>
                          <label id="certificado_file_text"></label>
                          <input type="hidden" id="certificado_file">
                        </div>

                        <div class="col-md-6">
                          <label>Llave <span class="text-danger">*</span> </label>
                          <br>
                          <input type="file" class="form-control-file" id="RutaLlave" name="llave">
                          <br>
                          <label id="llave_file_text"></label>
                          <input type="hidden" id="llave_file">
                        </div>
                      </div>
                      <div class="row">
                        <div class="col-md-6">
                          <label>Logo de la empresa <span class="text-danger">*</span> </label>
                          <br>
                          <input type="file" class="form-control-file" id="RutaLogo" name="logo" accept="image/png, image/gif, image/jpeg" />
                          <br>
                          <label id="logo_file_text"></label>
                          <input type="hidden" id="logo_file">
                        </div>
                      </div>
                  </div>
                  <div class="row">
                    <div class="col-md-12 mt-2" align="right">
                      <input class="btn btn-primary" type="submit" value="Guardar" />
                    </div>
                  </div>
                  </form>
                </div>
                <div class="tab-pane" id="correos" aria-expanded="false">
                  <div class="row">
                    <div class="col-md-4">
                      <div class="card">
                        <div class="card-header card-header-primary">
                          <div class="card-title text-center">
                            <h5>AGREGAR CORREO</h5>
                          </div>
                        </div>
                        <div class="card-body">

                          <div class="input-group input-group-static mb-1">
                            <label>Correo <span class="text-danger">*</span></label>
                            <input type="text" class="form-control" id="Correo">
                          </div>
                          <div class="input-group input-group-static">
                            <label>Usuario <span class="text-danger">*</span></label>
                            <input type="text" class="form-control" id="Usuario">
                          </div>
                          <div class="input-group input-group-static">
                            <label>Contraseña <span class="text-danger">*</span></label>
                            <input type="text" class="form-control" id="Contraseña">
                          </div>
                          <div class="input-group input-group-static">
                            <label>Host <span class="text-danger">*</span></label>
                            <input type="text" class="form-control" id="Host">
                          </div>
                          <div class="row">
                            <div class="col-6">
                              <div class="input-group input-group-static">
                                <label>Puerto <span class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="Puerto">
                              </div>
                            </div>
                            <div class="col-6">
                              <div class="input-group input-group-static">
                                <label>Seguridad <span class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="Seguridad">
                              </div>
                            </div>
                          </div>
                          <div class="form-group">
                            <label>Tipo <span class="text-danger">*</span></label>
                            <select class="form-control" id="Estatus_co" select-choices>
                              <option value="0" selected disabled> -[Selecciona una opción]-</option>
                              <option value="P">Principal</option>
                              <option value="S">Alterno</option>
                            </select>
                          </div>
                        </div>
                        <div class="card-footer text-right">
                          <button class="btn btn-secondary" onclick="limpiarSection()">Limpiar</button>
                          <button class="btn btn-primary" onclick="guardarCorreo()">Guardar</button>
                        </div>
                      </div>
                    </div>
                    <div class="col-md-8">
                      <div class="row tablesss">
                        <div class="col-12 table-responsive">
                          <table class="table table-bordered table-hover" id="gridCorreos" width="100%">
                            <thead>
                              <!-- <th class="text-white text-xxs font-weight-bolder opacity-7">ID</th> -->
                              <th class="text-white text-xxs font-weight-bolder opacity-7">Correo</th>
                              <th class="text-white text-xxs font-weight-bolder opacity-7">Usuario</th>
                              <th class="text-white text-xxs font-weight-bolder opacity-7">Contraseña</th>
                              <th class="text-white text-xxs font-weight-bolder opacity-7">Host</th>
                              <th class="text-white text-xxs font-weight-bolder opacity-7">Servidor</th>
                              <th class="text-white text-xxs font-weight-bolder opacity-7">Puerto</th>
                              <th class="text-white text-xxs font-weight-bolder opacity-7">Tipo</th>
                              <th class="text-white text-xxs font-weight-bolder opacity-7">Acciones</th>

                            </thead>
                            <tbody>

                            </tbody>
                          </table>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="tab-pane" id="ticket" aria-expanded="false">
                  <div class="row">
                    <div class="col-md-12 text-end">
                      <button class="btn btn-primary" onclick="nuevaLeyenda()">Nueva leyenda</button>
                    </div>
                  </div>
                  <div class="row tablesss">
                    <div class="col-12 table-responsive">
                      <table class="table table-bordered table-hover" id="gridLeyendas" width="100%">
                        <thead>
                          <!-- <th class="text-white text-xxs font-weight-bolder opacity-7">ID</th> -->
                          <th class="text-white text-xxs font-weight-bolder opacity-7">ID</th>
                          <th class="text-white text-xxs font-weight-bolder opacity-7">Prefijo</th>
                          <th class="text-white text-xxs font-weight-bolder opacity-7">Documento</th>
                          <th class="text-white text-xxs font-weight-bolder opacity-7">Leyenda</th>
                          <th class="text-white text-xxs font-weight-bolder opacity-7">Estatus</th>
                          <th class="text-white text-xxs font-weight-bolder opacity-7">Acciones</th>
                        </thead>
                        <tbody>

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

                <div class="tab-pane" id="timbrado" aria-expanded="false">
                  <div class="row">
                    <div class="col-md-3">
                      <div class="input-group input-group-static ">
                        <label>PAC <span class="text-danger">*</span></label>
                        <select class="form-control" id="PAC">
                          <option value="0" selected disabled> -[Selecciona una opción]-</option>

                          <option value="Detecno">Detecno</option>
                          <option value="FormasDigitales">FormasDigitales</option>
                        </select>
                      </div>
                    </div>
                    <div class="col-md-3">
                      <div class="input-group input-group-static ">
                        <label>Usuario <span class="text-danger">*</span></label>
                        <input type="text" class="form-control" id="UsuarioWS">
                      </div>
                    </div>
                    <div class="col-md-3">
                      <div class="input-group input-group-static ">
                        <label>Contraseña <span class="text-danger">*</span></label>
                        <input type="text" class="form-control" id="ContrasenaWS">
                      </div>
                    </div>
                    <div class="col-md-3">
                      <div class="input-group input-group-static ">
                        <label>Tipo <span class="text-danger">*</span></label>
                        <select class="form-control" id="tipo_pac">
                          <option value="0" selected disabled> -[Selecciona una opción]-</option>
                          <option value="DEV">Dev</option>
                          <option value="PROD">Prod</option>
                        </select>
                      </div>
                    </div>
                    <div class="col-md-4">
                      <div class="input-group input-group-static ">
                        <label>IP Timbrar <span class="text-danger">*</span></label>
                        <input type="text" class="form-control" id="IpTimbraWS">
                      </div>
                    </div>
                    <div class="col-md-4">
                      <div class="input-group input-group-static ">
                        <label>IP Cancelar <span class="text-danger">*</span></label>
                        <input type="text" class="form-control" id="IpCancelaWS">
                      </div>
                    </div>
                    <div class="col-md-2">
                      <div class="input-group input-group-static ">
                        <label>Prioridad <span class="text-danger">*</span></label>
                        <select class="form-control" id="prioridad">
                          <option value="0" selected disabled> -[Selecciona una opción]-</option>
                          <option value="P">Principal</option>
                          <option value="S">Secundario</option>
                        </select>
                      </div>
                    </div>
                    <div class="col-md-2">
                      <button class="btn btn-primary mt-3" onclick="agregarPac()">Agregar</button>
                    </div>
                  </div>
                  <br>
                  <div class="row tablesss">
                    <div class="col-12 table-responsive">
                      <table class="table table-bordered table-hover" id="gridPacs" width="100%">
                        <thead>
                          <th class="text-white text-xxs font-weight-bolder opacity-7">ID</th>
                          <th class="text-white text-xxs font-weight-bolder opacity-7">PAC</th>
                          <th class="text-white text-xxs font-weight-bolder opacity-7">Usuario</th>
                          <th class="text-white text-xxs font-weight-bolder opacity-7">Contraseña</th>
                          <th class="text-white text-xxs font-weight-bolder opacity-7">IP Timbrar</th>
                          <th class="text-white text-xxs font-weight-bolder opacity-7">IP Cancelar</th>
                          <th class="text-white text-xxs font-weight-bolder opacity-7">Tipo</th>
                          <th class="text-white text-xxs font-weight-bolder opacity-7">Prioridad</th>
                          <th class="text-white text-xxs font-weight-bolder opacity-7">Estatus</th>
                          <th class="text-white text-xxs font-weight-bolder opacity-7">Acciones</th>
                        </thead>
                        <tbody>

                        </tbody>
                      </table>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="modal fade" id="modalLeyendas">
  <div class="modal-dialog modal-lg modal-dialog-scrollable">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title font-weight-normal">Guardar leyenda</h5>
      </div>
      <div class="modal-body">
        <div class="row">
          <div class="col-4">
            <div class="input-group input-group-static mb-4">
              <label>Prefijo <span class="text-danger">*</span></label>
              <select class="form-control" id="id_prefijo">
                <option disabled selected value="0">-[Selecciona una opción]-</option>
                @foreach ($data['prefijos'] as $fp)
                <option value="{{ $fp->Id }}">({{ $fp->ClavePrefijo }}) {{ $fp->Descripcion }}</option>
                @endforeach
              </select>
            </div>
          </div>
        </div>
        <div class="input-group input-group-static mb-4">
          <label for="exampleFormControlTextarea1">Leyenda del documento <span class="text-danger">*</span></label>
          <textarea class="form-control" id="leyenda" rows="5"></textarea>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
        <button class="btn btn-primary" id="btnGenerar" onclick="saveLeyenda();">Guardar</button>
      </div>
    </div>
  </div>
</div>
<input type="hidden" id="id_correo_hidden">
<input type="hidden" id="id_leyenda_hidden">
<input type="hidden" id="id_pac_hidden">
@include('catalogo.domicilios.domicilios', ['Paises' => $Paises])
<script src="https://cdn.ckeditor.com/ckeditor5/35.1.0/classic/ckeditor.js"></script>
<script>
  $(document).ready(function() {
    $.ajaxSetup({
      headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
      }

    });



    $(".datepicker").flatpickr();
    // new Choices($('#RegimenFiscal')[0]);
    // new Choices($('#Colonias_Id')[0]);
    // new Choices($('#Giros_Id')[0]);
    // new Choices($('#PacsTimbrado_Id')[0]);
    // new Choices($('#Estatus_co')[0]);
    getInfoEmpresa()
    // loadGridCorreos()
  });

  function getInfoDomicilio(Colonia_id) {
    $.ajax({
        url: '{{ url("catalogo/empresas/get_infocol" )}}',
        type: 'POST',
        dataType: 'json',
        data: {
          id: Colonia_id,
        },
      })
      .done(function(resp) {
        // console.log(resp.data);
        $('#coloniaV').val(resp.data.colonia['Descripcion'])
        $('#paisV').val(resp.data.pais['Pais'])
        $('#estadoV').val(resp.data.estado['Estado'])
        $('#municipioV').val(resp.data.municipio['Municipio'])
        $('#poblacionV').val(resp.data.poblacion['Descripcion'])
        $('#cpV').val(resp.data.colonia['CodigoPostal'])

      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });
  }



  $('#addC').click(function() {
    $('#crearDomicilio').modal('show')
  })


  $Colonia.addEventListener('change', async (event) => {
    const $coloniaValue = $Colonia.options[$Colonia.selectedIndex].value;
    $btnIdentificarColonia.disabled = false;
    $formColoniaDomicilio.addEventListener('submit', async (event) => {
      event.preventDefault();
      // console.log($coloniaValue);
      fetchRequest('{{url("/domicilios/colonias/identificador")}}', {
          id: $coloniaValue
        })
        .then(response => {
          ({
            status,
            message,
            payload
          } = response);
          ({
            colonia,
            estado,
            municipio,
            pais,
            poblacion
          } = payload);
          if (status == 200) {
            Swal.fire({
              type: 'success',
              title: '¡Colonia Identificada!',
              showConfirmButton: false,
              timer: 2500
            });
            $('#crearDomicilio').modal('hide')
            $('#paisV').val(pais.Pais)
            $('#estadoV').val(estado.Estado)
            $('#municipioV').val(municipio.Municipio)
            $('#poblacionV').val(poblacion.Descripcion)
            $('#coloniaV').attr('colonia_id', colonia.Id)
            $('#coloniaV').val(colonia.Descripcion)
            $('#cpV').val(colonia.CodigoPostal)
          }
          if (status == 404) {
            Swal.fire({
              type: 'error',
              title: 'Oops...',
              text: 'ID incorrecto'
            });
            $('#paisV').val('')
            $('#estadoV').val('')
            $('#municipioV').val('')
            $('#poblacionV').val('')
            $('#coloniaV').val('')
            $('#cpV').val('')

          }
        })
    })
  })

  $("#formuploadajax").on("submit", function(e) {
    guardarEmpresa();
    // return false;

    e.preventDefault();
    var f = $(this);
    var formData = new FormData(document.getElementById("formuploadajax"));
    formData.append("dato", "valor");

    // if ($('#llave_file').val() != '' && $('#certificado_file').val() != '' && $('logo_file').val() != '') {
    //   return false;
    // }
    $.ajax({
        url: "{{ url('catalogo/empresas/guarda_archivos')}}",
        type: "post",
        dataType: "html",
        data: formData,
        cache: false,
        contentType: false,
        processData: false
      })
      .done(function(res) {
        console.log('success')
      });
  });

  // let editor;

  // ClassicEditor
  //   .create(document.querySelector('#editor'), {
  //     toolbar: [
  //       "selectAll",
  //       "undo",
  //       "redo",
  //       "heading",
  //       "bold",
  //       "italic",
  //       "blockQuote",
  //       "link",
  //       "indent",
  //       "outdent",
  //       "numberedList",
  //       "bulletedList",
  //       "insertTable",

  //     ]
  //   })
  //   .then(newEditor => {
  //     editor = newEditor;
  //   })
  //   .catch(error => {
  //     console.error(error);
  //   });


  function setGarantiaDeLluvia(valor) {

    if (valor == 1) {
      $('#contentNormasLluvia').show('slow');
    } else {
      $('#contentNormasLluvia').hide('slow');

    }
  }

  function getInfoEmpresa() {
    $.ajax({
        url: '{{ url("catalogo/empresas/get_info_empresa" )}}',
        type: 'POST',
        dataType: 'json',
      })
      .done(function(resp) {
        // console.log(resp.data);

        $('#idHidden').val(resp.data['Id'])
        $('#RazonSocial').val(resp.data['RazonSocial'])
        $('#Rfc').val(resp.data['Rfc'])
        $('#NombreComercial').val(resp.data['NombreComercial'])
        $('#RegimenFiscal').val(resp.data['RegimenFiscal'])
        $('#Telefono').val(resp.data['Telefono'])
        $('#Periodicidad').val(resp.data['Periodicidad'])
        $('input[name="garantia_lluvia"][value=' + resp.data['garantia_lluvia'] + ']').prop('checked', true);
        setGarantiaDeLluvia(resp.data['garantia_lluvia'])
        $('#TemaPlantilla').val(resp.data['TemaPlantilla'])
        $('#Calle').val(resp.data['Calle'])
        $('#NumeroExterior').val(resp.data['NumeroExterior'])
        $('#NumeroInterior').val(resp.data['NumeroInterior'])
        $('#Giros_Id').val(resp.data['Giros_Id'])
        getInfoDomicilio(resp.data['Colonias_Id'])
        $('#coloniaV').attr('colonia_id', resp.data['Colonias_Id'])

        $('#ClienteIntesys').val(resp.data['ClienteIntesys'])
        $('#PacsTimbrado_Id').val(resp.data['PacsTimbrado_Id'])
        $('#CaducidadContrasenas').val(resp.data['CaducidadContrasenas'])
        $('#NumeroIntentosContrasena').val(resp.data['NumeroIntentosContrasena'])
        $('#TiempoCaducidadSesion').val(resp.data['TiempoCaducidadSesion'])
        $('#ModoMantenimiento').val(resp.data['ModoMantenimiento'])
        $('#VigenciaCSD_Desde').val(resp.data['VigenciaCSD_Desde'])
        $('#VigenciaCSD_Hasta').val(resp.data['VigenciaCSD_Hasta'])

        $('#NumeroCertificado').val(resp.data['NumeroCertificado'])
        $('#Llave').val(resp.data['Llave'])

        // $('#RutaCertificado').val(resp.data['RutaCertificado'])
        $('#certificado_file').val(resp.data['RutaCertificado'])
        $('#certificado_file_text').text(resp.data['RutaCertificado'])

        // $('#RutaLLave').val(resp.data['RutaLLave'])
        $('#llave_file').val(resp.data['RutaLlave'])
        $('#llave_file_text').text(resp.data['RutaLlave'])

        $('#logo_file').val(resp.data['RutaLogo'])
        $('#logo_file_text').text(resp.data['RutaLogo'])

        $('#garantia_reglas').val(resp.data['garantia_reglas'])

        // editor.setData(resp.data['garantia_reglas'])

      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });
  }


  function guardarEmpresa() {

    var garantia_reglas = $('#garantia_reglas').val();
    var idEmpresa = $('#idHidden').val()
    var RazonSocial = $('#RazonSocial').val()
    var NombreComercial = $('#NombreComercial').val()
    var Rfc = $('#Rfc').val()
    var RegimenFiscal = $('#RegimenFiscal option:selected').val()
    var RegimenFiscal2 = $('#RegimenFiscal option:selected').attr('fisica')
    var RegimenFiscal3 = $('#RegimenFiscal option:selected').attr('moral')
    var Calle = $('#Calle').val()
    var NumeroInterior = $('#NumeroInterior').val()
    var NumeroExterior = $('#NumeroExterior').val()
    var Colonias_Id = $('#coloniaV').attr('colonia_id')
    var Giros_Id = $('#Giros_Id option:selected').val()
    var ClienteIntesys = $('#ClienteIntesys').val()
    var PacsTimbrado_Id = $('#PacsTimbrado_Id').val()
    var CaducidadContrasenas = $('#CaducidadContrasenas').val()
    var NumeroIntentosContrasena = $('#NumeroIntentosContrasena').val()
    var TiempoCaducidadSesion = $('#TiempoCaducidadSesion').val()
    var ModoMantenimiento = $('#ModoMantenimiento').val()
    var RutaCertificado = $('#RutaCertificado').val()
    var NumeroCertificado = $('#NumeroCertificado').val()
    var RutaLlave = $('#RutaLlave').val()
    var Llave = $('#Llave').val()
    var RutaLogo = $('#RutaLogo').val()
    var TemaPlantilla = $('#TemaPlantilla option:selected').val()

    // var userPac = $('#userPac').val()
    // var passwordPac = $('#passwordPac').val()
    var VigenciaCSD_Desde = $('#VigenciaCSD_Desde').val()
    var VigenciaCSD_Hasta = $('#VigenciaCSD_Hasta').val()
    var garantia_lluvia = $('input[name="garantia_lluvia"]:checked').val()
    var Telefono = $('#Telefono').val();
    var Periodicidad = $('#Periodicidad option:selected').val()

    if ($('#llave_file').val() == '' && $('#certificado_file').val() == '') {
      if (RutaCertificado == '' || RutaLlave == '') {
        Swal.fire({
          type: 'error',
          title: 'Oops...',
          text: 'Debes ingresar toda la información de facturación',
          showConfirmButton: false,
          timer: 2500
        });
        return false;
      }
    }
    if (Rfc == '' || garantia_lluvia == '' || RazonSocial == '' || Calle == '' || NumeroExterior == '' || Colonias_Id == '' || Giros_Id == '' || ClienteIntesys == '' || PacsTimbrado_Id == '' || NumeroCertificado == '' || VigenciaCSD_Desde == '' || VigenciaCSD_Hasta == '' || RegimenFiscal == 0 || ModoMantenimiento == 0 || Telefono == '') {
      Swal.fire({
        type: 'error',
        title: 'Oops...',
        text: 'Debes ingresar toda la información obligatoria',
        showConfirmButton: false,
        timer: 2500
      });
      return false;

    }
    if (VigenciaCSD_Desde >= VigenciaCSD_Hasta) {
      Swal.fire({
        type: 'error',
        title: 'Oops...',
        text: 'La fecha "vigencia CSD hasta" debe de ser mayor.',
        showConfirmButton: false,
        timer: 2500
      });
      return false;
    }
    if ($('#coloniaV').val() == '') {

      Swal.fire({
        type: 'error',
        title: 'Oops...',
        text: 'Debes ingresar un domicilio',
        showConfirmButton: false,
        timer: 2500
      });
      return false;
    }

    // $('#cargandoModal').modal()
    $.ajax({
        url: '{{ url("catalogo/empresas/guarda_empresa" )}}',
        type: 'POST',
        dataType: 'json',
        data: {
          idEmpresa: idEmpresa,
          RazonSocial: RazonSocial,
          NombreComercial: NombreComercial,
          Rfc: Rfc,
          RegimenFiscal: RegimenFiscal,
          Calle: Calle,
          NumeroInterior: NumeroInterior,
          NumeroExterior: NumeroExterior,
          Colonias_Id: Colonias_Id,
          Giros_Id: Giros_Id,
          ClienteIntesys: ClienteIntesys,
          PacsTimbrado_Id: PacsTimbrado_Id,
          CaducidadContrasenas: CaducidadContrasenas,
          NumeroIntentosContrasena: NumeroIntentosContrasena,
          TiempoCaducidadSesion: TiempoCaducidadSesion,
          ModoMantenimiento: ModoMantenimiento,
          RutaCertificado: RutaCertificado,
          NumeroCertificado: NumeroCertificado,
          RutaLlave: RutaLlave,
          LlaveFile: $('#llave_file').val(),
          CertificadoFile: $('#certificado_file').val(),
          RutaLogo: RutaLogo,
          LogoFile: $('#logo_file').val(),
          VigenciaCSD_Desde: VigenciaCSD_Desde,
          VigenciaCSD_Hasta: VigenciaCSD_Hasta,
          garantia_lluvia: garantia_lluvia,
          Periodicidad: Periodicidad,
          Telefono: Telefono,
          Llave: Llave,
          TemaPlantilla: TemaPlantilla,
          garantia_reglas: garantia_reglas,
          // userPac: userPac,
          // passwordPac: passwordPac,
        },
      })
      .done(function(resp) {
        // console.log(resp);
        if (resp.Id > 0) {
          // $('#cargandoModal').modal('hide')
          Swal.fire({
            type: 'success',
            title: '¡Se ha guardado con éxito!',
            showConfirmButton: false,
            timer: 2500
          });
          window.location.href = "{{ url('catalogo/empresas') }}";
        } else {
          // $('#cargandoModal').modal('hide')
          alert('Error al guardar')
        }
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });

  }


  //CORREOS
  function loadGridCorreos() {
    $('#gridCorreos').dataTable().fnDestroy();
    $('#gridCorreos td').css('white-space', 'initial');
    $('#gridCorreos').DataTable({
      // dom: 'Bfrtip',
      "scrollX": true,
      //serverSide: true,
      ajax: {
        url: "{{url('catalogo/empresas/get_correos')}}",
        type: "POST",
      },
      columns: [{
          data: "Correo"
        },
        {
          data: "Usuario"
        },
        {
          data: "Contrasena"
        },
        {
          data: "Host"
        },
        {
          data: "Puerto"
        },
        {
          data: "Seguridad"
        },
        {
          data: "Estatus"
        },
        {
          data: "acciones"
        },
      ],
      order: [
        [0, "asc"]
      ],

    });
  }

  function guardarCorreo() {
    var Estatus = $('#Estatus_co option:selected').val(),
      Correo = $('#Correo').val(),
      Usuario = $('#Usuario').val(),
      Contrasena = $('#Contraseña').val(),
      Host = $('#Host').val(),
      Puerto = $('#Puerto').val(),
      Seguridad = $('#Seguridad').val(),
      Id = $('#id_correo_hidden').val();

    if (Correo == '' || Usuario == '' || Contrasena == '' || Host == '' || Puerto == '' || Seguridad == '' || Estatus == 0) {
      Swal.fire({
        type: 'error',
        title: 'Oops...',
        text: 'Debes ingresar toda la información obligatoria.',
        showConfirmButton: false,
        timer: 2500
      });
      return false;
    }
    $.ajax({
        url: "{{ url('catalogo/empresas/guarda_correos')}}",
        type: 'POST',
        dataType: 'json',
        data: {
          Id: Id,
          Estatus: Estatus,
          Correo: Correo,
          Usuario: Usuario,
          Contrasena: Contrasena,
          Host: Host,
          Puerto: Puerto,
          Seguridad: Seguridad
        },
      })
      .done(function(resp) {
        Swal.fire({
          type: 'success',
          title: resp.mensaje,
          showConfirmButton: false,
          timer: 2500
        });
        $('#gridCorreos').DataTable().ajax.reload();
        limpiarSection()
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });
  }

  function limpiarSection() {
    $('#id_correo_hidden').val('');
    $('#Correo').val('');
    $('#Usuario').val('');
    $('#Contraseña').val('');
    $('#Host').val('');
    $('#Puerto').val('');
    $('#Seguridad').val('');
    $('#Estatus').val(0);
    // $('#Estatus').selectpicker("refresh");

  }

  function editarCorreo(id) {
    $.ajax({
        url: "{{url('catalogo/empresas/get_correo')}}",
        type: 'POST',
        dataType: 'json',
        data: {
          Id: id,
        }
      })
      .done(function(resp) {
        console.log("success");
        $('#id_correo_hidden').val(resp.data['Id']);
        $('#Correo').val(resp.data['Correo']);
        $('#Usuario').val(resp.data['Usuario']);
        $('#Contraseña').val(resp.data['Contrasena']);
        $('#Puerto').val(resp.data['Puerto']);
        $('#Host').val(resp.data['Host']);
        $('#Seguridad').val(resp.data['Seguridad']);
        $('#Estatus_co').val(resp.data['Estatus']);
        // $('#Estatus_co').selectpicker("refresh");
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });
  }

  function eliminarCorreo(id) {
    Swal.fire({
      title: '¿Estás seguro de eliminar el correo?',
      text: "Esta acción no es reversible",
      icon: 'warning',
      showCancelButton: true,
      confirmButtonColor: '#3085d6',
      cancelButtonColor: '#d33',
      cancelButtonText: 'Cancelar',
      confirmButtonText: 'Si, eliminar.'
    }).then((result) => {
      if (result.value) {
        //$('#cargandoModal').modal()
        $.ajax({
            url: "{{url('catalogo/empresas/delete_correo')}}",
            type: 'POST',
            dataType: 'json',
            data: {
              Id: id,
            }
          })
          .done(function(resp) {
            console.log("success");
            Swal.fire({
              type: 'success',
              title: resp.mensaje,
              showConfirmButton: false,
              timer: 2500
            });
            $('#gridCorreos').DataTable().ajax.reload();
            // limpiarSection()
          })
          .fail(function() {
            console.log("error");
          })
          .always(function() {
            console.log("complete");
          });

      }
    })
  }

  //LEYENDAS
  function loadGridLeyendas() {
    $('#gridLeyendas').dataTable().fnDestroy();
    $('#gridLeyendas td').css('white-space', 'initial');
    $('#gridLeyendas').DataTable({
      lengthMenu: [10, 15, 20, 50, 100],
      processing: true,
      responsive: true,
      scrollY: '50vh',
      scrollCollapse: true,
      scrollX: true,
      ajax: {
        url: "{{url('catalogo/empresas/get_leyendas')}}",
        type: "POST",
      },
      columns: [{
          data: "id"
        },
        {
          data: "prefijo"
        },
        {
          data: "documento"
        },
        {
          data: "leyenda"
        },
        {
          data: "estatus"
        },
        {
          data: "acciones"
        },
      ],
      order: [
        [0, "asc"]
      ],

    });
  }

  function nuevaLeyenda() {
    $('#id_prefijo').val(0)
    $('#leyenda').val('')
    $('#modalLeyendas').modal('show');
  }

  function saveLeyenda() {
    var id = $('#id_leyenda_hidden').val(),
      id_prefijo = $('#id_prefijo option:selected').val(),
      leyenda = $('#leyenda').val();

    if (id_prefijo == 0 || leyenda == '') {
      Swal.fire({
        type: 'error',
        title: 'Oops...',
        text: 'Debes ingresar toda la información obligatoria.',
        showConfirmButton: false,
        timer: 2500
      });
      return false;
    }
    $.ajax({
        url: "{{ url('catalogo/empresas/guarda_leyenda')}}",
        type: 'POST',
        dataType: 'json',
        data: {
          id: id,
          id_prefijo: id_prefijo,
          leyenda: leyenda,
          estatus: 1
        },
      })
      .done(function(resp) {
        Swal.fire({
          type: 'success',
          title: resp.mensaje,
          showConfirmButton: false,
          timer: 2500
        });
        $('#gridLeyendas').DataTable().ajax.reload();
        $('#modalLeyendas').modal('hide')
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });
  }

  function editarLeyenda(id) {
    $.ajax({
        url: "{{url('catalogo/empresas/get_leyenda')}}",
        type: 'POST',
        dataType: 'json',
        data: {
          id: id,
        }
      })
      .done(function(resp) {
        console.log("success");
        $('#id_leyenda_hidden').val(resp.data['id']);
        $('#leyenda').val(resp.data['leyenda']);
        $('#id_prefijo').val(resp.data['id_prefijo']);
        $('#modalLeyendas').modal('show')
        // $('#Estatus_co').selectpicker("refresh");
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });
  }

  function eliminarLeyenda(id) {
    Swal.fire({
      title: '¿Estás seguro de eliminar la leyenda?',
      text: "Esta acción no es reversible",
      icon: 'warning',
      showCancelButton: true,
      confirmButtonColor: '#3085d6',
      cancelButtonColor: '#d33',
      cancelButtonText: 'Cancelar',
      confirmButtonText: 'Si, eliminar'
    }).then((result) => {
      if (result.value) {
        //$('#cargandoModal').modal()
        $.ajax({
            url: "{{url('catalogo/empresas/delete_leyenda')}}",
            type: 'POST',
            dataType: 'json',
            data: {
              id: id,
            }
          })
          .done(function(resp) {
            console.log("success");
            Swal.fire({
              type: 'success',
              title: resp.mensaje,
              showConfirmButton: false,
              timer: 2500
            });
            $('#gridLeyendas').DataTable().ajax.reload();
            // limpiarSection()
          })
          .fail(function() {
            console.log("error");
          })
          .always(function() {
            console.log("complete");
          });

      }
    })
  }

  function loadGridPacs() {
    $('#gridPacs').dataTable().fnDestroy();
    $('#gridPacs td').css('white-space', 'initial');
    $('#gridPacs').DataTable({
      // dom: 'Bfrtip',
      "scrollX": true,
      //serverSide: true,
      ajax: {
        url: "{{url('catalogo/empresas/get_pacs')}}",
        type: "POST",
      },
      columns: [{
          data: "Id"
        },
        {
          data: "PAC"
        },
        {
          data: "UsuarioWS"
        },
        {
          data: "ContrasenaWS"
        },
        {
          data: "IpTimbraWS"
        },
        {
          data: "IpCancelaWS"
        },
        {
          data: "tipo"
        },
        {
          data: "prioridad"
        },
        {
          data: "estatus"
        },
        {
          data: "acciones"
        },
      ],
      order: [
        [0, "asc"]
      ],

    });
  }

  function agregarPac() {
    var PAC = $('#PAC option:selected').val(),
      UsuarioWS = $('#UsuarioWS').val(),
      ContrasenaWS = $('#ContrasenaWS').val(),
      IpTimbraWS = $('#IpTimbraWS').val(),
      IpCancelaWS = $('#IpCancelaWS').val(),
      tipo = $('#tipo_pac option:selected').val(),
      prioridad = $('#prioridad option:selected').val(),
      Id = $('#id_pac_hidden').val();

    if (PAC == 0 || UsuarioWS == '' || ContrasenaWS == '' || IpTimbraWS == '' || IpCancelaWS == '' || tipo == 0) {
      Swal.fire({
        type: 'error',
        title: 'Oops...',
        text: 'Debes ingresar toda la información obligatoria.',
        showConfirmButton: false,
        timer: 2500
      });
      return false;
    }
    $.ajax({
        url: "{{ url('catalogo/empresas/save_pac')}}",
        type: 'POST',
        dataType: 'json',
        data: {
          Id: Id,
          PAC: PAC,
          UsuarioWS: UsuarioWS,
          ContrasenaWS: ContrasenaWS,
          IpTimbraWS: IpTimbraWS,
          IpCancelaWS: IpCancelaWS,
          tipo: tipo,
          prioridad: prioridad,
        },
      })
      .done(function(resp) {
        if (resp.result == 1) {

          Swal.fire({
            type: 'success',
            title: resp.mensaje,
            showConfirmButton: false,
            timer: 2500
          });
          $('#gridPacs').DataTable().ajax.reload();
          limpiarSectionPacs()
        } else {
          Swal.fire({
            type: 'error',
            title: resp.mensaje,
            showConfirmButton: false,
            timer: 2500
          });
        }

      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });
  }

  function limpiarSectionPacs() {
    $('#PAC').val(0);
    $('#UsuarioWS').val('');
    $('#ContrasenaWS').val('');
    $('#IpTimbraWS').val('');
    $('#IpCancelaWS').val('');
    $('#tipo_pac').val(0);
    $('#prioridad').val(0);
    $('#id_pac_hidden').val();
  }


  function editarPac(Id) {
    $.ajax({
        url: "{{ url('catalogo/empresas/get_pac')}}",
        type: 'POST',
        dataType: 'json',
        data: {
          Id: Id,
        },
      })
      .done(function(resp) {
        $('#PAC').val(resp.data['PAC']);
        $('#UsuarioWS').val(resp.data['UsuarioWS']);
        $('#ContrasenaWS').val(resp.data['ContrasenaWS']);
        $('#IpTimbraWS').val(resp.data['IpTimbraWS']);
        $('#IpCancelaWS').val(resp.data['IpCancelaWS']);
        $('#tipo_pac').val(resp.data['tipo']);
        $('#prioridad').val(resp.data['prioridad']);
        $('#id_pac_hidden').val(resp.data['Id']);
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });
  }

  function deletePac(Id) {
    $.ajax({
        url: "{{ url('catalogo/empresas/delete_pac')}}",
        type: 'POST',
        dataType: 'json',
        data: {
          Id: Id,
        },
      })
      .done(function(resp) {
        Swal.fire({
          type: 'success',
          title: resp.mensaje,
          showConfirmButton: false,
          timer: 2500
        });
        $('#gridPacs').DataTable().ajax.reload();
        limpiarSectionPacs()
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });
  }
</script>

@endsection