@extends('dashboard.layouts.app')

@section('title', __('Availability Summary for') . ' ' . $teacher->name)
@section('page_heading', __('Availability Summary for') . ' ' . $teacher->name)

@section('breadcrumb')
    <li class="breadcrumb-item"><a href="{{ route('dashboard.home') }}">{{ __('Home') }}</a></li>
    <li class="breadcrumb-item"><a href="{{ route('dashboard.users.index') }}">{{ __('Teachers') }}</a></li>
    <li class="breadcrumb-item"><a href="{{ route('dashboard.users.show', $teacher) }}">{{ $teacher->name }}</a></li>
    <li class="breadcrumb-item active">{{ __('Availability Summary') }}</li>
@endsection

@section('content')

    <div class="card">
        <div class="card-header">
            <h3 class="card-title">{{ __('Availability Summary for') }} {{ $teacher->name }}</h3>
            <div class="card-toolbar">
                 <a href="{{ route('dashboard.teachers.availability.edit', $teacher) }}" class="btn btn-sm btn-primary">{{ __('Edit Availability') }}</a>
            </div>
        </div>
        <div class="card-body">
             <p><strong>{{ __('Timezone') }}:</strong> {{ $current_timezone }}</p>

            <div class="table-responsive">
                <table class="table table-bordered">
                    <thead>
                        <tr>
                            <th>{{ __('Day') }}</th>
                            <th>{{ __('Available Hours') }}</th>
                        </tr>
                    </thead>
                     <tbody>
                        @foreach($dailyHours as $day => $hours)
                            <tr>
                                <td>{{ $day }}</td>
                                <td>{{ $hours }}</td>
                            </tr>
                        @endforeach
                    </tbody>
                    <tfoot>
                        <tr>
                            <td><strong>{{ __('Weekly Total') }}:</strong></td>
                            <td>{{ $weeklyHours }} {{__('Hours')}}</td>
                        </tr>
                        <tr>
                            <td><strong>{{ __('Monthly Total (approx.)') }}:</strong></td>
                            <td>{{ $monthlyHours }} {{__('Hours')}}</td>
                        </tr>
                    </tfoot>
                </table>
             </div>

            @if($availabilities->isNotEmpty())
            <h4>{{__('Availability Details')}}</h4>
             <div class="table-responsive">
                <table class="table table-striped">
                    <thead>
                        <tr>
                            <th>{{ __('Day') }}</th>
                            <th>{{ __('Start Time') }}</th>
                            <th>{{ __('End Time') }}</th>
                             <th>{{__('Time Zone')}}</th>
                            <th>{{ __('Available') }}</th>

                        </tr>
                    </thead>
                    <tbody>

                        @foreach ($availabilities as $availability)
                        <tr>
                            <td>{{$availability->dayName}}</td>
                            <td>{{ $availability->start_time_formatted }}</td>
                            <td>{{ $availability->end_time_formatted }}</td>
                            <td>{{$availability->timezone}}</td>
                            <td>
                                @if ($availability->is_available)
                                    <span class="badge badge-success">{{__('Yes')}}</span>
                                @else
                                  <span class="badge badge-danger">{{__('No')}}</span>
                                @endif
                            </td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
             </div>
            @endif
        </div>
         <div class="card-footer">
              <a href="{{route('dashboard.users.show',$teacher->id)}}" class="btn btn-secondary">{{__('Back to Teacher')}}</a>
       </div>
    </div>

@endsection