@extends('layouts.app')

@section('content')
<div class="container-fluid">
    <!-- Horizontal Layout -->
    <div class="row clearfix">
        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
            <div class="card">
                <div class="header">
                    <h2>
                        <strong>Editando Facultad</strong>
                    </h2>
                </div>
                <div class="body">
                    <form class="form-horizontal" id="form-facultad" method="post" action="{{ url('/') }}/facultad/guardar" enctype="multipart/form-data">
                        <input type="hidden" name="id" value="{{ $facultad->facultadId }}">
                        <div class="row clearfix">
                            <div class="col-md-2">
                                <label for="nombre-facultad"><span class="font-bold col-red">*</span> Facultad</label>
                            </div>
                            <div class="col-md-10">
                                <div class="form-line">
                                    <input type="text" name="nombre" class="form-control" placeholder="Facultad" maxlength="150" autocomplete="off" value="{{ $facultad->nombreFacultad }}" required autofocus>
                                </div>
                            </div>
                        </div>
                        <div class="row clearfix">
                            <div class="col-md-2">
                                <label for="abreviatura">Abreviatura</label>
                            </div>
                            <div class="col-md-4">
                                <div class="form-line">
                                    <input type="text" name="abreviatura" class="form-control" maxlength="10" placeholder="Abreviatura" autocomplete="off" value="{{ $facultad->abreviatura }}">
                                </div>
                            </div>
                            <div class="col-md-2">
                                <label for="correo"><span class="font-bold col-red">*</span> Correo</label>
                            </div>
                            <div class="col-md-4">
                                <div class="form-line">
                                    <input type="email" name="email" class="form-control" maxlength="60" placeholder="Correo" autocomplete="off" value="{{ $facultad->correo }}" required>
                                </div>
                            </div>
                        </div>
                        <div class="row clearfix">
                            <div class="col-md-2">
                                <label for="correo">Logo</label>
                            </div>
                            <div id="elemento-foto" 
@if (empty($facultad->logo))
                            style="display:none;"
@endif
                            >
                                <div class="col-md-3">
                                    <img src="{{ $facultad->logo }}" style="width: 100%;">
                                </div>
                                <div class="col-md-2">
                                    <a id="cambiar-foto" class="btn btn-block bg-orange waves-effect"> <i class="material-icons">cached</i> <span>Cambiar logo</span> </a>
                                </div>
                            </div>
                            <div id="elemento-cambiar" 
@if (!empty($facultad->logo))
                            style="display:none;"
@endif
                            >
                                <div class="col-md-6">
                                    <div class="form-line">
                                        <input type="file" name="foto" id="foto" class="form-control" placeholder="Logo" 
@if (!empty($facultad->logo))
                                        disabled="disabled"
@endif
                                        >
                                    </div>
                                </div>
@if (!empty($facultad->logo))
                                <div class="col-md-2">
                                    <a id="cancelar-cambiar-foto" class="btn btn-block bg-orange waves-effect"> <i class="material-icons">undo</i> <span>Regresar</span> </a>
                                </div>
@endif
                            </div>
                        </div>
                        <div class="row clearfix">
                            <div class="col-md-6">
                                <button type="submit" class="btn btn-block btn-lg bg-blue waves-effect"> <i class="material-icons">save</i> <strong>Guardar</strong> </button>
                            </div>
                            <div class="col-md-6">
                                <a class="btn btn-block btn-lg bg-fia waves-effect" href="{{ url('/') }}/"> <i class="material-icons">clear</i> <strong>Cancelar</strong> </a>
                            </div>
                        </div>
                        <div class="row clearfix">
                            <div class="col-md-12" style="margin-bottom: 0px;">
                                <p class="font-bold col-red">(*) Campos obligatorios.</p>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <!-- #END# Horizontal Layout -->
</div>
@endsection