@extends('plantilla')
@section('titulo', "Datos del dominio")
@section('scripts')
<link href="{{ asset('css/datatables.min.css') }}" rel="stylesheet">
<script src="{{ asset('js/datatables.min.js') }}"></script>
<script>
    globalId = '0';
    
</script>
@endsection
@section('breadcrumb')
<ol class="breadcrumb">
    <li class="breadcrumb-item"><a href="/home">Inicio</a></li>
    <li class="breadcrumb-item"><a href="/dominios">Dominios</a></li>
    <li class="breadcrumb-item active">Nuevo</li>
</ol>
<ol class="toolbar">
    <li class="btn-item"><a title="Nuevo" href="/dominio/nuevo" class="fa fa-plus-circle" aria-hidden="true"><span>Nuevo</span></a></li>
    <li class="btn-item"><a title="Guardar" href="#" class="fa fa-floppy-o" aria-hidden="true" onclick="javascript: $('#modalGuardar').modal('toggle');"><span>Guardar</span></a>
    </li>
    <li class="btn-item"><a title="Eliminar" href="#" class="fa fa-trash-o" aria-hidden="true" onclick="javascript: $('#mdlEliminar').modal('toggle');"><span>Eliminar</span></a>
    </li>
    <li class="btn-item"><a title="Enviar correo" onclick="enviarCorreo()" class="fa fa-envelope-o" href="#"><span>Enviar correo</span></a></li>
</ol>
@endsection
@section('contenido')
<div class="row">
    <div id = "msg"></div>
    </div>
<form id="form1" method="POST">
    <input type="hidden" name="_token" value="{{ csrf_token() }}"></input>
    <input type="hidden" id="id" name="id" class="form-control" value="{{$globalId}}" required>
    <div class="col-sm-12">
        <div class="card mb-4">
                <div class="card-header py-3">
                  <h6 class="m-0 font-weight-bold text-primary">Cliente</h6>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-lg-6 fomr-group">
                            <label>Cliente *</label>
                            <select class="form-control selectpicker" id="lstClienteDominio" name="lstClienteDominio" data-live-search="true" required>
                                <option selected disabled value="">Seleccionar</option>
                                @for ($i = 0; $i < count($array_cliente); $i++)
                                    @if (isset($dominio) && $array_cliente[$i]->id == $dominio->fk_idcliente)
                                        <option selected value="{{ $array_cliente[$i]->id }}">{{ $array_cliente[$i]->nombre }} {{ $array_cliente[$i]->apellido}}</option>
                                    @else
                                        <option value="{{ $array_cliente[$i]->id }}">{{ $array_cliente[$i]->nombre }} {{ $array_cliente[$i]->apellido}}</option>
                                    @endif
                                @endfor
                            </select>
                        </div>
                        <div class="col-lg-6 fomr-group">
                            <label>Plan de hosting *</label>

                            <select class="form-control selectpicker" id="lstProductoDominio" name="lstProductoDominio" data-live-search="true" required>
                                <option selected disabled value="">Seleccionar</option>
                                @for ($i = 0; $i < count($array_producto); $i++)
                                   
                                      @if (isset($dominio) && $array_producto[$i]->idproducto == $dominio->fk_idproducto)
                                        <option selected value="{{ $array_producto[$i]->idproducto }}">{{ $array_producto[$i]->nombre }}</option>
                                    @else
                                        <option value="{{ $array_producto[$i]->idproducto }}">{{ $array_producto[$i]->nombre }}</option>
                                    @endif
                                
                                @endfor
                            </select>
                        </div>
                    </div>
                </div>
        </div>
    </div>
    <div class="col-sm-12">
        <div class="card mb-4">
                <div class="card-header py-3">
                  <h6 class="m-0 font-weight-bold text-primary">Dominio</h6>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="form-group col-lg-6">
                            <label>Nombre *</label>
                            <input type="text" id="txtDominio" name="txtDominio" class="form-control" value="{{$dominio->dominio }}" required>
                        </div>
                        <div class="form-group col-lg-6">
                            <label>Fecha de alta *</label>
                            <p>{{ $fecha_actual or $dominio->fecha_alta }}</p>
                        </div>
                        <div class="form-group col-lg-6">
                            <label>Estado *</label>
                            <select id="lstEstado" name="lstEstado" class="form-control" required >
                                @for ($i = 0; $i < count($array_estado); $i++)
                                    @if (isset($dominio) and $array_estado[$i]->id == $dominio->fk_estado_id)
                                        <option selected value="{{ $array_estado[$i]->id }}">{{ $array_estado[$i]->nombre }}</option>
                                    @else
                                        <option value="{{ $array_estado[$i]->id }}">{{ $array_estado[$i]->nombre }}</option>
                                    @endif
                                @endfor
                            </select>
                        </div>
                        <div class="form-group col-lg-6">
                            <label>Servidor *</label>
                            <select id="lstServidor" name="lstServidor" class="form-control" required >
                                @for ($i = 0; $i < count($array_servidor); $i++)
                                    @if (isset($dominio) and $array_servidor[$i]->id == $dominio->fk_servidor_id)
                                        <option selected value="{{ $array_servidor[$i]->id }}">{{ $array_servidor[$i]->nombre }}</option>
                                    @else
                                        <option value="{{ $array_servidor[$i]->id }}">{{ $array_servidor[$i]->nombre }}</option>
                                    @endif
                                @endfor
                            </select>
                        </div>
                        <div class="form-group col-lg-6">
                            <label>Tecnología *</label>
                            <select id="lstTecnologia" name="lstTecnologia" class="form-control" required >
                                @for ($i = 0; $i < count($array_tecnologia); $i++)
                                    @if (isset($dominio) and $array_tecnologia[$i]->id == $dominio->fk_tecnologia_id)
                                        <option selected value="{{ $array_tecnologia[$i]->id }}">{{ $array_tecnologia[$i]->nombre }}</option>
                                    @else
                                        <option value="{{ $array_tecnologia[$i]->id }}">{{ $array_tecnologia[$i]->nombre }}</option>
                                    @endif
                                @endfor
                            </select>
                        </div>
                        <div class="form-group col-lg-6">
                            <label>Última actualización *</label>
                            <input type="date" id="txtFechaUltAct" name="txtFechaUltAct" class="form-control" value="{{$dominio->fecha_ult_actualizacion }}" required>
                        </div>
                    </div>
                </div>
        </div>
    </div>
    <div class="col-sm-12">
        <div class="card mb-4">
                <div class="card-header py-3">
                  <h6 class="m-0 font-weight-bold text-primary">SFTP</h6>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="form-group col-lg-6">
                            <label>Usuario *</label>
                            <input type="text" id="txtUsuarioSFTP" name="txtUsuarioSFTP" class="form-control" value="{{$SFTP->usuario }}" required>
                        </div>
                        <div class="form-group col-lg-6">
                            <label>Clave *</label>
                            <input type="text" id="txtClaveSFTP" name="txtClaveSFTP" class="form-control" value="{{$SFTP->clave }}" required>
                        </div>
                    </div>
                </div>
        </div>
    </div>
    <div class="row">
        <div class="col-12">  
        <div class="card mb-3">
                <div class="card-header">
                     Correo
                    <div class="pull-right">
                        <button type="button" class="btn btn-secondary fa fa-minus-circle" onclick="abrirDialogoEliminarCorreo()"></button>
                        <button type="button" class="btn btn-secondary fa fa-plus-circle" data-toggle="modal" data-target="#modalCorreo"></button>
                    </div>
                </div>
                <div class="panel-body">
                    <table id="grillaCorreo" class="display" style="width:98%">
                        <thead>
                            <tr>
                                <th> </th>
                                <th>Usuario</th>
                                <th>Clave</th>
                            </tr>
                        </thead>
                    </table> 
                 </div>
            </div>          
        </div>
    </div>
    <div class="row">
        <div class="col-12">  
        <div class="card mb-3">
                <div class="card-header">
                     Base de datos
                    <div class="pull-right">
                        <button type="button" class="btn btn-secondary fa fa-minus-circle" onclick="abrirDialogoEliminarBaseDeDatos()"></button>
                        <button type="button" class="btn btn-secondary fa fa-plus-circle" data-toggle="modal" data-target="#modalBaseDeDatos"></button>
                    </div>
                </div>
                <div class="panel-body">
                    <table id="grillaBaseDeDatos" class="display" style="width:98%">
                        <thead>
                            <tr>
                                <th> </th>
                                <th>Base de datos</th>
                                <th>Usuario</th>
                                <th>Clave</th>
                                <th>Host</th>
                            </tr>
                        </thead>
                    </table> 
                 </div>
            </div>          
        </div>
    </div>
</form>
<div class="modal fade" id="modalCorreo" tabindex="-1" role="dialog" aria-labelledby="modalCorreoLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="modalCorreoLabel">Correo</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <div class="row">
            <div class="col-12 form-group">
                <label>Usuario</label>
                <input type="email" id="txtUsuarioCorreo" name="txtUsuarioCorreo" class="form-control">
            </div>
            <div class="col-12 form-group">
                <label>Clave</label>
                <input id="txtClaveCorreo" name="txtClaveCorreo" class="form-control">
            </div>
        </div>
    </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
        <button type="button" class="btn btn-primary" onclick="fAgregarCorreo();">Agregar</button>
      </div>
    </div>
  </div>
</div>
<div class="modal fade" id="modalmsgCorreo" tabindex="-1" role="dialog" aria-labelledby="modalmsgCorreo">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="modalBuscarLabel">Eliminar</h5>
                <button class="close" type="button" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="form-group col-sm-6">
                    &#191;Desea confirmar la operacion?
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancelar</button>
                <button type="button" class="btn btn-primary" onclick="eliminarCorreo();">Aceptar</button>
            </div>
        </div>
    </div>
</div>
<!-- -->
<div class="modal fade" id="modalBaseDeDatos" tabindex="-1" role="dialog" aria-labelledby="modalBaseDeDatos" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="modalBaseDeDatosLabel">Base de datos</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <div class="row">
            <div class="col-12 form-group">
                <label>Base de datos</label>
                <input type="text" id="txtBaseDeDatos" name="txtBaseDeDatos" class="form-control">
            </div>
            <div class="col-12 form-group">
                <label>Usuario</label>
                <input type="text" id="txtUsuarioBaseDeDatos" name="txtUsuarioBaseDeDatos" class="form-control">
            </div>
            <div class="col-12 form-group">
                <label>Clave</label>
                <input type="text" id="txtClaveBaseDeDatos" name="txtClaveBaseDeDatos" class="form-control">
            </div>
            <div class="col-12 form-group">
                <label>Host</label>
                <input type="text" id="txtHostBaseDeDatos" name="txtHostBaseDeDatos" class="form-control">
            </div>
        </div>
    </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
        <button type="button" class="btn btn-primary" onclick="fAgregarBaseDeDatos();">Agregar</button>
      </div>
    </div>
  </div>
</div>
<div class="modal fade" id="modalmsgBaseDeDatos" tabindex="-1" role="dialog" aria-labelledby="modalmsgBaseDeDatos">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="modalBuscarLabel">Eliminar</h5>
                <button class="close" type="button" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="form-group col-sm-6">
                    &#191;Desea confirmar la operacion?
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancelar</button>
                <button type="button" class="btn btn-primary" onclick="eliminarBaseDeDatos();">Aceptar</button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="mdlEliminar" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title" id="exampleModalLabel">Eliminar registro?</h5>
            <button class="close" type="button" data-dismiss="modal" aria-label="Close">
              <span aria-hidden="true">×</span>
            </button>
          </div>
          <div class="modal-body">¿Deseas eliminar el registro actual?</div>
          <div class="modal-footer">
            <button class="btn btn-secondary" type="button" data-dismiss="modal">No</button>
            <button type="button" class="btn btn-primary" onclick="eliminar();">Sí</button>
          </div>
        </div>
      </div>
</div>
<script>
    //funcion enviar correo 
    function enviarCorreo(){
        $.ajax({
            type: "GET",
            url: "{{ asset('/dominio/enviarCorreo') }}",
            data: { id:globalId },
            async: true,
            dataType: "json",
            success: function (data) {
                msgShow(data.MSG, data.ESTADO);
                if (data.ESTADO = "success") {
                    
                }
            }
        });
    }

    //grilla correo
    var dataTable = $('#grillaCorreo').DataTable({
	    "processing": true,
        "serverSide": false,
	    "bFilter": false,
	    "bInfo": true,
	    "bSearchable": false,
        "paging": false,
        "pageLength": 25,
        "order": [[ 0, "asc" ]],
	    "ajax": "{{ asset('/dominio/cargarGrillaCorreo?id='.$globalId)}}"
    });
    //grilla base de datos
    var dataTable = $('#grillaBaseDeDatos').DataTable({
	    "processing": true,
        "serverSide": false,
	    "bFilter": false,
	    "bInfo": true,
	    "bSearchable": false,
        "paging": false,
        "pageLength": 25,
        "order": [[ 0, "asc" ]],
	    "ajax": "{{ asset('/dominio/cargarGrillaBaseDeDatos?id='.$globalId)}}"
    });
    //Define constantes
    /*globalId = '<?php// echo (isset($_REQUEST["id"]) ? $_REQUEST["id"] : "0"); ?>';*/

    $("#form1").validate();
   

    function guardar() {
        form1.submit();
    }

    function eliminar() {
        $.ajax({
            type: "GET",
            url: "{{ asset('/dominio/eliminar') }}",
            data: { id:globalId },
            async: true,
            dataType: "json",
            success: function (data) {
                msgShow(data.MSG, data.ESTADO);
                if (data.ESTADO = "success") {
                    $("#btnEnviar").hide();
                    $("#btnEliminar").hide();
                    $('#mdlEliminar').modal('toggle');
                }
            }
        });
    }

    @if(isset($dominio) == false)
        $("#lstServidor").prop("selectedIndex", "-1");
        $("#lstTecnologia").prop("selectedIndex", "-1");
        $("#lstFirewall").prop("selectedIndex", "-1");
        $("#lstActualizado").prop("selectedIndex", "-1");
    @endif

//modal correo
    function abrirModalCorreo() {
        $('#modalCorreo').modal('toggle');
    }

    function limpiarFormularioCorreo(){
        $("#txtUsuarioCorreo").val("");
        $("#txtClaveCorreo").val("");
    }

    function fAgregarCorreo(){
    var grilla = $('#grillaCorreo').DataTable();
    grilla.row.add([
        "<input type='checkbox' name='txtId[]' value=''>",
        $("#txtUsuarioCorreo").val() + "<input type='hidden' name=txtUsuariocorreo[]' value='"+ $("#txtUsuarioCorreo").val() +"'>",
        $("#txtClaveCorreo").val() + "<input type='hidden' name='txtClavecorreo[]' value='"+ $("#txtClaveCorreo").val() +"'>"
    ]).draw();
    $('#modalCorreo').modal('toggle');
    limpiarFormularioCorreo();
    }

    
    function abrirDialogoEliminarCorreo() {
        $('#modalmsgCorreo').modal('toggle');
    }
    function eliminarCorreo() {
        var grilla = $('#grillaCorreo').DataTable();
        $('#grillaCorreo input[type=checkbox]').each(function () {
            if (this.checked) {
                $(this.parentElement.parentNode).addClass('borrar');
            }
        });
        grilla.rows('.borrar').remove().draw(false);
        $('#modalmsgCorreo').modal('toggle');
    }
//modal base de datos
    function abrirModalBaseDeDatos() {
        $('#modalBaseDeDatos').modal('toggle');
    }

    function limpiarFormularioBaseDeDatos(){
        $("#txtBaseDeDatos").val("");
        $("#txtUsuarioBaseDeDatos").val("");
        $("#txtClaveBaseDeDatos").val("");
        $("#txtHostBaseDeDatos").val("");
    }

    function fAgregarBaseDeDatos(){
    var grilla = $('#grillaBaseDeDatos').DataTable();
    grilla.row.add([
        "<input type='checkbox' name='txtId[]' value=''>",
        $("#txtBaseDeDatos").val() + "<input type='hidden' name='txtBasedeDatos[]' value='"+ $("#txtBaseDeDatos").val() +"'>",
        $("#txtUsuarioBaseDeDatos").val() + "<input type='hidden' name='txtUsuarioBasedeDatos[]' value='"+ $("#txtUsuarioBaseDeDatos").val() +"'>",
        $("#txtClaveBaseDeDatos").val() + "<input type='hidden' name='txtClaveBasedeDatos[]' value='"+ $("#txtClaveBaseDeDatos").val() +"'>",
        $("#txtHostBaseDeDatos").val() + "<input type='hidden' name='txtHostBasedeDatos[]' value='"+ $("#txtHostBaseDeDatos").val() +"'>"
    ]).draw();
    $('#modalBaseDeDatos').modal('toggle');
    limpiarFormularioBaseDeDatos();
    }

    function abrirDialogoEliminarBaseDeDatos() {
        $('#modalmsgBaseDeDatos').modal('toggle');
    }
    function eliminarBaseDeDatos() {
        var grilla = $('#grillaBaseDeDatos').DataTable();
        $('#grillaBaseDeDatos input[type=checkbox]').each(function () {
            if (this.checked) {
                $(this.parentElement.parentNode).addClass('borrar');
            }
        });
        grilla.rows('.borrar').remove().draw(false);
        $('#modalmsgBaseDeDatos').modal('toggle');
    }
</script>
@endsection