@extends('layouts.app_check', ['class' => 'bg-default'])

@section('content')
    <div class="header bg-gradient-primary py-7 py-lg-8">
        <div class="container">
            <div class="header-body text-center mt-7 mb-7">
                <div class="row justify-content-center">
                    <div class="col-lg-5 col-md-6">
                       
                    </div>
                </div>
            </div>
        </div>
        <div class="separator separator-bottom separator-skew zindex-100">
            <svg x="0" y="0" viewBox="0 0 2560 100" preserveAspectRatio="none" version="1.1" xmlns="http://www.w3.org/2000/svg">
                <polygon class="fill-default" points="2560 0 2560 100 0 100"></polygon>
            </svg>
        </div>
    </div>

    <!-- modal empresa  -->
    <div class="modal" id="SelectDatabaseModal"  tabindex="-1" role="dialog" data-backdrop="static" data-keyboard="false" >
        <div class="modal-dialog modal-dialog-centered" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title">Selecciona el sistema que quieres usar</h5>
             
            </div>
            <div class="modal-body">
            <div class="avatar-parent-child" style=" display: flex; justify-content: center; align-items: center; ">
                                  
         
            {{-- inicio cards --}}
            <div class="company ml-4 mr-4 pointer" style="cursor:pointer;" data-id="promocion">
                                  <div style="width: 100px; height: 100px" href="#"
                  class="avatar">
                  <!-- rounded-circle -->
                  <img alt="Promocion" avatar="Promocion">
                  
              </div>
              <h3>Promociones</h3>
      </div>
            <div class="company ml-4 mr-4 pointer" style="cursor:pointer;" data-id="comparacion">
                                  <div style="width: 100px; height: 100px" href="#"
                  class="avatar">
                  <!-- rounded-circle -->
                  <img alt="Comparacion farmacia" avatar="Comparacion farmacia">
                  
              </div>
              <h3>Comparacion</h3>
      </div>
        
              {{-- fin cards --}}
      
              {{Form::open(['route'=>'change_module_dashboard','method'=>'post','id'=>'change_database_form'])}}
                         
                         {{Form::hidden('change_database',null,['class'=>'form-control','id'=>'change_database'])}}
              {{Form::close()}}
                              </div>
            </div>
            
          </div>
        </div>
      </div>
      
      <!-- fin modal empresa  -->
@endsection
@section('js')
<script src="{{ asset('js/letter.avatar.js') }}"></script>
<script>
        
    $(document).ready(function () {
        
   $("#SelectDatabaseModal").modal("show");
   LetterAvatar.transform();
   $("#SelectDatabaseModal .company").on('click',function(){
   
    $.ajax({
        url:"{{route('change_module_dashboard')}}",
        beforeSend:function(){
            Swal.fire({
    title: 'Cargando...',
    text: 'Por favor, espera',
    allowOutsideClick: false,
    allowEscapeKey: false,
    showConfirmButton: false,
    didOpen: () => {
        Swal.showLoading();
    }
});
        },
        data:{change_database:$(this).attr('data-id')},
        success:function(result){
            
            if(result.success){
                url_redirect="{{route('redirectOption')}}";
                window.location.href=url_redirect;
            }else{
                console.log("Ha ocurrido un error");
            }
        },
        error:function(err){
            console.log(err);
        },
        complete:function(){
            Swal.close();
        }
    })

        // $("#change_database").val($(this).attr('data-id'));
        // $("#change_database_form").trigger('submit');
       
    });
  
    });
</script>
@endsection