@extends('adminlte::page')

@section('title', $period->name)

@section('content')
    @include('admin.parts.info')
    <section class="content">
      <div class="container-fluid">
        <div class="row">
          <div class="col-md-3">
            <!-- Profile Image -->
            <div class="card card-primary card-outline">
              <div class="card-body box-profile">
                <div class="text-center">
                  <img class="img-fluid img-circle"
                       src="https://ui-avatars.com/api/?name={{$period->name}}&background=0D8ABC&color=fff"
                       alt="User profile picture">
                </div>

                <h3 class="profile-username text-center">{{$period->name}}</h3>

                {{-- <p class="text-muted text-center">{{$period->code}}</p> --}}
                <hr>
                <strong><i class="fa fa-calendar mr-1"></i> Fecha de Inicio: </strong><br>
                {{$period->data_start}}
                <br><br>
                <strong><i class="fa fa-calendar mr-1"></i> Fecha de Finalización: </strong><br>
                {{$period->data_end}}
                <hr>
                <a href="{{route('periods.edit',$period)}}" class="btn btn-primary btn-block">Editar</a><br>
                <form action="{{ route('periods.destroy',$period)}}" method="post" style="display: inline">
                  @csrf @method('delete')
                  <button class="btn btn-danger btn-block" onclick="return confirm('¿Estás seguro de eliminar este Periodo?')">Eliminar</i></button>  
                </form>
              </div>
              <!-- /.card-body -->
            </div>
            <!-- /.card -->
            <!-- About Me Box -->
            <div class="card card-primary">
                <div class="card-header">
                <h3 class="card-title">Detalles</h3>
                </div>
                <!-- /.card-header -->
                <div class="card-body">
                <strong><i class="fas fa-calendar-alt mr-1"></i> Fecha de Creación</strong>

                <p class="text-muted">
                    {{$period->created_at}}
                </p>

                <hr>

                <strong><i class="fas fa-calendar-alt mr-1"></i> Última Modificación</strong>

                <p class="text-muted">
                    {{$period->updated_at}}
                </p>
                </div>
                <!-- /.card-body -->
            </div>
            <!-- /.card -->
          </div>
          <!-- /.col -->
          <div class="col-md-9">
              <div class="form-row">
                
                  <div class="form-group col-md-12 ml-auto">
                      <div class="ml-auto">
                        @if ($period->state == 1)
                            <a onclick="return confirm('¿Estás seguro de finalizar este Periodo?')"  href="{{route('periods.state',$period)}}" class="btn btn-success btn-block" role="button">Periodo en Proceso&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>
                        @else
                            <a onclick="return confirm('¿Estás seguro de reanudar este Periodo?')"  href="{{route('periods.state',$period)}}" class="btn btn-danger btn-block" role="button">Periodo Finalizado</a>
                        @endif
                      </div>
                  </div>
                  
                  <div class="form-group col-md-12">
                    <section class="content">
                      <div class="container-fluid">
                        <div class="row">
                          @if (!count($courses))
                              <p>Aun no se han registrado cursos para este periodo. <a href="{{route('courses.index')}}">Registrar un curso</a></p>                              
                          @endif
                        @foreach ($courses as $course)
                          <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
                            <!-- small box -->
                            <div class="small-box bg-info">
                              <div class="inner">
                                <h5>
                                  {{App\Models\Language::find($course->language_id)->name}}
                                </h5>
                                <p>
                                  {{App\Models\Level::find($course->level_id)->name}} -
                                  {{App\Models\Period::find($course->period_id)->name}} - 
                                  Ciclo {{$course->cycle}} -
                                  Salón {{$course->classroom}}
                                </p>
                              </div>
                              <div class="icon">
                                <i class="ion ion-ios-book"></i>
                              </div>
                              <a href="{{route('courses.show',$course)}}" class="small-box-footer">Ir al curso <i class="fas fa-arrow-circle-right"></i></a>
                            </div>
                          </div>
                        @endforeach
                        </div>
                      </div>
                    </section>
                  </div>
              </div>
            <!-- /.nav-tabs-custom -->
          </div>
          <!-- /.col -->
        </div>
        <!-- /.row -->
      </div><!-- /.container-fluid -->
    </section>

@stop