<style>
    .oculto{
        display: none;
    }
    /* Para ocultar los botones en los input number  */
    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
    }

    /* Firefox */
    input[type=number] {
    -moz-appearance: textfield;
    }
</style>
<link rel="stylesheet" href="<?=base_url()?>assets/css/jquery.tosrus.all.css">
<script src="<?=base_url()?>assets/js/custom/custom-administrar_emailServicio.js"></script>
<script src="<?=base_url()?>assets/js/jquery.tosrus.all.min.js"></script>

<div class="container">
    <br>
    <div class="row">
        <div class="col-sm-12">
            <blockquote class="blockquote bq-primary htext">
                <b>Configurar email de servicio</b>
            </blockquote>
        </div>

    </div>
    <br>
    <div class="col-sm-12" id="form_emailConfig">
            <?php 
            $email = $suc_actual['email'];
            ?>
            <div class="row">                           
                <div class="col-sm-3">
                    <i class="fa fa-filter iconos-usuario"></i>
                    &nbsp;
                    <label for="sucursal_select">Sucursal:</label>
                </div>
                <div class="col-sm-8">
                    <select name="sucursal_select" id="sucursal_select" class="browser-default form-control">
                        <?php 
                        foreach ($sucursales["sucursales"] as $val) { 
                            ?>
                            <option name="<?php echo $val['id'];?>" id="<?php echo $val['id'];?>"><?php echo $val['nombre']?></option>
                            <?php
                        }
                        ?>
                    </select>
                </div>
            </div>
            <br>
            <div class="row">                           
                <div class="col-sm-3">
                    <i class="fa fa-server iconos-usuario"></i>
                    &nbsp;
                    <label for="mail_host">Host SMTP:</label>
                </div>
                <div class="col-sm-8">
                    <input type="text" name="mail_host" id="mail_host" placeholder="Host aun sin definir" class="form-control input-usuario" value=" <?php echo $email['mail_host'] ?> " >
                </div>
            </div>
            <br>
            <div class="row">
                <div class="col-sm-3">
                    <i class="fa fa-user iconos-usuario"></i>
                    &nbsp;
                    <label for="mail_userName">Usuario SMTP:</label>
                </div>
                <div class="col-sm-8">
                    <input type="text" name="mail_userName" id="mail_userName" placeholder="Usuario aun sin definir" class="form-control input-usuario" value = " <?php echo $email['mail_userName'] ?> ">
                </div>
            </div>
            <br>
            <div class="row">                      
                <div class="col-sm-3">
                    <i class="fa fa-key iconos-usuario"></i>
                    &nbsp;
                    <label for="mail_password">Password SMTP:</label>
                </div>
                <div class="col-sm-8">
                    <input type="text" name="mail_password" id="mail_password" placeholder="Password aun sin definir" class="form-control input-usuario" value ="<?php echo $email['mail_password'] ?>">
                </div>
            </div>
            <br>
            <div class="row">                      
                <div class="col-sm-3">
                    <i class="fa fa-plug iconos-usuario"></i>
                    &nbsp;
                    <label for="mail_port">Puerto SMTP:</label>
                </div>
                <div class="col-sm-8">
                    <input type="number" name="mail_port" id="mail_port" placeholder="Puerto aun sin definir" class="form-control input-usuario" value ="<?php echo $email['mail_port'] ?>">
                </div>
            </div>
            <br>
            <div class="row">                      
                <div class="col-sm-3">
                    <i class="fa fa-lock iconos-usuario"></i>
                    &nbsp;
                    <label for="mail_smtpSecure">Protocolo SMTP:</label>
                </div>
                <div class="col-sm-8">
                    <input type="text" name="mail_smtpSecure" id="mail_smtpSecure" placeholder="Seguridad aun sin definir" class="form-control input-usuario" value ="<?php echo $email['mail_smtpSecure'] ?>">
                </div>
            </div>
            <br>
            <div class="row">                      
                <div class="col-sm-3">
                    <i class="fa fa-cogs iconos-usuario"></i>
                    &nbsp;
                    <label for="mail_smtpAuth">Autenticación SMTP:</label>
                </div>
                <div class="col-sm-8">
                    <select name="mail_smtpAuth" id="mail_smtpAuth" class="browser-default form-control">
                        <option <?php if($email['mail_smtpAuth'] == "1"){ ?> selected <?php } ?> value="1">Activado</option>
                        <option <?php if($email['mail_smtpAuth'] == "0" | $email['mail_smtpAuth'] == null){ ?> selected <?php } ?> value="0">Desactivado</option>
                    </select>
                </div>
            </div>
            <br>
            <div class="row">                      
                <div class="col-sm-3">
                    <i class="fa fa-envelope iconos-usuario"></i>
                    &nbsp;
                    <label for="mail_destinatario">Email destinatario:</label>
                </div>
                <div class="col-sm-8">
                    <input type="email" name="mail_destinatario" placeholder="Destinatario para prueba aun sin definir" id="mail_destinatario" class="form-control input-usuario">
                </div>
            </div>
            <br>
            <div style="text-align:center;">
                <button id="testEmail" type="button" class="btn btn-success">Probar conexión</button>
                <button id="guardarCambiosSMTP" type="button" class="btn btn-success oculto">Guardar cambios</button>
            </div>
        </div>
    </div>
</div>
