@extends('layouts.app')

@section('content')
<div class="row">
    <div class="col-12">
        <div class="d-flex justify-content-between align-items-center mb-4">
            <h2><i class="fas fa-users"></i> Data Mahasiswa</h2>
            <a href="{{ route('mahasiswa.create') }}" class="btn btn-primary">
                <i class="fas fa-plus"></i> Tambah Mahasiswa
            </a>
        </div>

        <div class="card">
            <div class="card-body">
                <!-- Search Form -->
                <div class="row mb-3">
                    <div class="col-md-6">
                        <form method="GET" action="{{ route('mahasiswa.index') }}">
                            <div class="input-group">
                                <input type="text" class="form-control" name="search" 
                                       placeholder="Cari berdasarkan NIM, Nama, atau Email..." 
                                       value="{{ request('search') }}">
                                <button class="btn btn-outline-secondary" type="submit">
                                    <i class="fas fa-search"></i>
                                </button>
                                @if(request('search'))
                                    <a href="{{ route('mahasiswa.index') }}" class="btn btn-outline-danger">
                                        <i class="fas fa-times"></i>
                                    </a>
                                @endif
                            </div>
                        </form>
                    </div>
                    <div class="col-md-6 text-end">
                        <small class="text-muted">
                            Total: {{ $mahasiswas->total() }} mahasiswa
                        </small>
                    </div>
                </div>

                <!-- Table -->
                <div class="table-responsive">
                    <table class="table table-striped table-hover">
                        <thead class="table-dark">
                            <tr>
                                <th width="5%">No</th>
                                <th width="10%">Foto</th>
                                <th width="15%">NIM</th>
                                <th width="20%">Nama</th>
                                <th width="20%">Email</th>
                                <th width="15%">Jurusan</th>
                                <th width="8%">Semester</th>
                                <th width="7%">Aksi</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse($mahasiswas as $index => $mahasiswa)
                                <tr>
                                    <td>{{ $mahasiswas->firstItem() + $index }}</td>
                                    <td>
                                        @php
                                                $foto = $mahasiswa->foto;
                                            @endphp

                                            @if($foto)
                                                <img src="{{ asset('storage/' . $foto) }}" 
                                                    class="me-2" 
                                                    width="60" height="60"
                                                    style="object-fit: cover;"
                                                    alt="Foto Mahasiswa">
                                            @else
                                                <div class="bg-secondary rounded-circle me-2 d-flex align-items-center justify-content-center" 
                                                    style="width: 60px; height: 60px;">
                                                    <i class="fas fa-user text-white"></i>
                                                </div>
                                            @endif
                                    </td>
                                    <td>
                                        <strong>{{ $mahasiswa->nim }}</strong>
                                    </td>
                                    <td>{{ $mahasiswa->nama }}</td>
                                    <td>
                                        <a href="mailto:{{ $mahasiswa->email }}" class="text-decoration-none">
                                            {{ $mahasiswa->email }}
                                        </a>
                                    </td>
                                    <td>
                                        <span class="badge bg-info">{{ $mahasiswa->jurusan }}</span>
                                    </td>
                                    <td>
                                        <span class="badge bg-success">{{ $mahasiswa->semester }}</span>
                                    </td>
                                    <td>
                                        <div class="btn-group" role="group">
                                            <a href="{{ route('mahasiswa.show', $mahasiswa->id) }}" 
                                               class="btn btn-sm btn-outline-info" title="Detail">
                                                <i class="fas fa-eye"></i>
                                            </a>
                                            <a href="{{ route('mahasiswa.edit', $mahasiswa->id) }}" 
                                               class="btn btn-sm btn-outline-warning" title="Edit">
                                                <i class="fas fa-edit"></i>
                                            </a>
                                            <form method="POST" action="{{ route('mahasiswa.destroy', $mahasiswa->id) }}" 
                                                  class="d-inline" 
                                                  onsubmit="return confirm('Apakah Anda yakin ingin menghapus mahasiswa ini?')">
                                                @csrf
                                                @method('DELETE')
                                                <button type="submit" class="btn btn-sm btn-outline-danger" title="Hapus">
                                                    <i class="fas fa-trash"></i>
                                                </button>
                                            </form>
                                        </div>
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="8" class="text-center py-4">
                                        <div class="text-muted">
                                            <i class="fas fa-users fa-3x mb-3"></i>
                                            <h5>Tidak ada data mahasiswa</h5>
                                            <p>Silakan tambah mahasiswa baru dengan klik tombol "Tambah Mahasiswa"</p>
                                        </div>
                                    </td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>

                <!-- Pagination -->
                @if($mahasiswas->hasPages())
                    <div class="d-flex justify-content-center mt-4">
                        {{ $mahasiswas->appends(request()->query())->links() }}
                    </div>
                @endif
            </div>
        </div>
    </div>
</div>
@endsection