@extends('layouts.app')

@section('title','Dashboard Guru')

@section('content')

<div class="container-fluid">

    {{-- HEADER --}}
    <div class="card card-modern shadow-sm border-0 mb-4">

        <div class="card-body">

            <div class="row align-items-center">

                <div class="col-md-8">

                    <h3 class="font-weight-bold mb-1">

                        Selamat Datang,
                        {{ $guru->nama }}

                    </h3>

                    <p class="text-muted mb-0">

                        Semoga aktivitas mengajar hari ini berjalan lancar.

                    </p>

                </div>

                <div class="col-md-4 text-md-right">

                    <h5 class="text-primary mb-0">

                        {{ now()->translatedFormat('l, d F Y') }}

                    </h5>

                </div>

            </div>

        </div>

    </div>

    {{-- CARD --}}
    <div class="row">

        <div class="col-lg-4">

            <div class="card border-0 shadow-sm">

                <div class="card-body text-center">

                    <img
                        src="https://ui-avatars.com/api/?name={{ urlencode($guru->nama) }}&background=2563eb&color=fff&size=200"
                        class="rounded-circle shadow mb-3"
                        width="90">

                    <h4 class="font-weight-bold">

                        {{ $guru->nama }}

                    </h4>

                    <span class="badge badge-primary px-3 py-2">

                        Guru Pengajar

                    </span>

                    <hr>

                    <div class="row text-center">

                        <div class="col">

                            <small class="text-muted">

                                Status

                            </small>

                            <h6 class="mt-2">

                                {{ $guru->status }}

                            </h6>

                        </div>

                        <div class="col">

                            <small class="text-muted">

                                Kode Guru

                            </small>

                            <h6 class="mt-2">

                                {{ $guru->nip }}

                            </h6>

                        </div>

                    </div>

                </div>

            </div>

        </div>

        <div class="col-lg-4">

            <div class="small-card">

                <div>

                    <small>

                        Kehadiran Bulan Ini

                    </small>

                    <h2>

                        {{ $hadirBulanIni }}

                    </h2>

                </div>

                <div class="small-icon bg-success">

                    <i class="fas fa-user-check"></i>

                </div>

            </div>

        </div>


    </div>

    {{-- Jadwal --}}
    <div class="card card-modern mt-4">

        <div class="card-header bg-white border-0">

            <h5 class="mb-0">

                <i class="fas fa-calendar-alt text-primary mr-2"></i>

                Jadwal Mengajar Hari Ini

            </h5>

        </div>

        <div class="card-body">

            <div class="table-responsive">

                <table class="table table-modern table-hover">

                    <thead>

                        <tr>

                            <th>Mata Pelajaran</th>

                            <th>Kelas</th>

                            <th>Jam</th>

                        </tr>

                    </thead>

                    <tbody>

                        @forelse($jadwalHariIni as $j)

                        <tr>

                            <td>

                                <strong>

                                    {{ $j->mataPelajaran->nama_mapel }}

                                </strong>

                            </td>

                            <td>

                                <span class="badge badge-info px-3 py-2">

                                    {{ $j->kelas->nama_kelas }}

                                </span>

                            </td>

                            <td>

                                <i class="far fa-clock text-primary mr-1"></i>

                                {{ substr($j->jam_mulai,0,5) }}

                                -

                                {{ substr($j->jam_selesai,0,5) }}

                            </td>

                        </tr>

                        @empty

                        <tr>

                            <td colspan="3" class="text-center py-5">

                                <i class="fas fa-calendar-times fa-3x text-secondary mb-3"></i>

                                <h5>

                                    Tidak Ada Jadwal Hari Ini

                                </h5>

                                <small class="text-muted">

                                    Selamat menikmati waktu luang Anda.

                                </small>

                            </td>

                        </tr>

                        @endforelse

                    </tbody>

                </table>

            </div>

        </div>

    </div>

</div>

@endsection