@extends('layouts.app')

@section('title', 'ছাত্র/ছাত্রী তালিকা')

@section('content')
<div class="container">
    <div class="row">
        <div class="col-12">
            <div class="card text-center shadow-sm">
                <div class="card-body" style="background-color: #e8f4f8; border-radius: 10px;">
                    <form class="form-horizontal" method="POST" action="{{ route('students.search') }}">
                        @csrf
                        <div class="form-group row justify-content-center">
                            <div class="col-md-3 mb-2">
                                <select name="search_type" class="form-control" required>
                                    <option value="">খুঁজুন...</option>
                                    <option value="student_id" {{ old('search_type') == 'student_id' ? 'selected' : '' }}>ছাত্র আইডি</option>
                                    <option value="name" {{ old('search_type') == 'name' ? 'selected' : '' }}>নাম</option>
                                    <option value="class" {{ old('search_type') == 'class' ? 'selected' : '' }}>শ্রেণি</option>
                                    <option value="phone" {{ old('search_type') == 'phone' ? 'selected' : '' }}>মোবাইল নম্বর</option>
                                </select>
                            </div>
                            <div class="col-md-5 mb-2">
                                <input type="text" 
                                       class="form-control" 
                                       name="search_value" 
                                       placeholder="আইডি/নাম/শ্রেণি/মোবাইল লিখুন"
                                       value="{{ old('search_value') }}"
                                       required>
                            </div>
                            <div class="col-md-2 mb-2">
                                <button type="submit" class="btn btn-info btn-block">
                                    <i class="fa fa-search"></i> খুঁজুন
                                </button>
                            </div>
                        </div>
                        
                        <div class="form-group row justify-content-center mt-3">
                            <div class="col-md-12">
                                <a href="{{ route('students.create') }}" class="btn btn-success">
                                    <i class="fa fa-plus-circle"></i> নতুন ছাত্র/ছাত্রী ভর্তি
                                </a>
                                <a href="{{ route('students.index') }}" class="btn btn-secondary">
                                    <i class="fa fa-list"></i> সকল ছাত্র/ছাত্রী
                                </a>
                                <button type="button" class="btn btn-warning" onclick="window.print()">
                                    <i class="fa fa-print"></i> প্রিন্ট
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <div class="row mt-4">
        <div class="col-12">
            <div class="card border-info">
                <div class="card-header bg-info text-white">
                    <h5 class="mb-0"><i class="fa fa-users"></i> শ্রেণি ভিত্তিক দ্রুত প্রবেশ</h5>
                </div>
                <div class="card-body">
                    <div class="row">
                        @foreach($classes as $class)
                        <div class="col-md-2 col-sm-4 mb-2">
                            <a href="{{ route('students.class-list', $class->id) }}" 
                               class="btn btn-outline-primary btn-block">
                                {{ $class->class_name_bn }} 
                                @if($class->section)({{ $class->section }})@endif
                                <span class="badge badge-primary">{{ $class->total_students ?? 0 }}</span>
                            </a>
                        </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </div>

    @if(isset($students) && $students->count() > 0)
    <div class="row mt-4">
        <div class="col-12">
            <div class="card">
                <div class="card-header bg-success text-white">
                    <h5 class="mb-0">ছাত্র/ছাত্রী তালিকা (মোট: {{ $students->count() }} জন)</h5>
                </div>
                <div class="card-body">
                    <div class="table-responsive">
                        <table class="table table-bordered table-striped table-hover" id="studentTable">
                            <thead class="bg-primary text-white text-center">
                                <tr>
                                    <th>ছবি</th>
                                    <th>আইডি</th>
                                    <th>নাম (বাংলা)</th>
                                    <th>শ্রেণি/শাখা</th>
                                    <th>রোল</th>
                                    <th>মোবাইল</th>
                                    <th>ভর্তির তারিখ</th>
                                    <th>স্ট্যাটাস</th>
                                    <th width="150">একশন</th>
                                </tr>
                            </thead>
                            <tbody class="text-center">
                                @foreach($students as $student)
                                <tr>
                                    <td>
                                        @if($student->photo)
                                            <img src="{{ asset($student->photo) }}" 
                                                 alt="ছবি" 
                                                 style="width: 40px; height: 40px; border-radius: 50%; object-fit: cover;">
                                        @else
                                            <div style="width: 40px; height: 40px; border-radius: 50%; background-color: #ddd; line-height: 40px; margin: auto;">
                                                <i class="fa fa-user text-white"></i>
                                            </div>
                                        @endif
                                    </td>
                                    <td><strong>{{ $student->student_id }}</strong></td>
                                    <td>{{ $student->name_bn }}</td>
                                    <td>{{ $student->class->class_name_bn ?? 'N/A' }} {{ $student->section }}</td>
                                    <td>{{ $student->roll_number }}</td>
                                    <td>{{ $student->phone }}</td>
                                    <td>{{ \Carbon\Carbon::parse($student->admission_date)->format('d-m-Y') }}</td>
                                    <td>
                                        <span class="badge badge-{{ $student->status ? 'success' : 'danger' }}">
                                            {{ $student->status ? 'সক্রিয়' : 'নিষ্ক্রিয়' }}
                                        </span>
                                    </td>
                                    <td>
                                        <div class="btn-group">
                                            <a href="{{ route('students.show', $student->id) }}" class="btn btn-sm btn-info" title="বিস্তারিত">
                                                <i class="fa fa-eye"></i>
                                            </a>
                                            <a href="{{ route('students.edit', $student->id) }}" class="btn btn-sm btn-warning" title="এডিট">
                                                <i class="fa fa-edit"></i>
                                            </a>
                                            <a href="{{ route('students.id-card', $student->id) }}" class="btn btn-sm btn-success" title="আইডি কার্ড" target="_blank">
                                                <i class="fa fa-id-card"></i>
                                            </a>
                                        </div>
                                    </td>
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @elseif(request()->isMethod('post') || request()->has('search_type'))
    <div class="row mt-4">
        <div class="col-12 text-center">
            <div class="alert alert-warning py-4">
                <i class="fa fa-exclamation-triangle fa-3x mb-3 text-warning"></i>
                <h5>দুঃখিত, আপনার দেওয়া তথ্যের সাথে মিল আছে এমন কোনো ছাত্র/ছাত্রী খুঁজে পাওয়া যায়নি!</h5>
                <a href="{{ route('students.index') }}" class="btn btn-primary mt-2">সকলের তালিকা দেখুন</a>
            </div>
        </div>
    </div>
    @endif
</div>
@endsection

@section('scripts')
<script>
    $(document).ready(function() {
        if ($('#studentTable').length) {
            $('#studentTable').DataTable({
                "language": {
                    "search": "তালিকায় খুঁজুন:",
                    "lengthMenu": "_MENU_ টি রেকর্ড দেখুন",
                    "info": "মোট _TOTAL_ টির মধ্যে _START_ থেকে _END_ দেখানো হচ্ছে",
                    "paginate": {
                        "first": "প্রথম",
                        "last": "শেষ",
                        "next": "পরবর্তী",
                        "previous": "পূর্ববর্তী"
                    },
                    "emptyTable": "টেবিলে কোনো তথ্য নেই",
                    "zeroRecords": "ম্যাচিং কোনো তথ্য পাওয়া যায়নি"
                },
                "order": [[1, 'desc']] // Student ID অনুযায়ী সর্টিং
            });
        }
    });
</script>
@endsection