@extends('layouts.institution')

@section('content')
<div class="container-fluid px-4 py-4">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <h4 class="fw-bold mb-1">সাবজেক্ট ব্যবস্থাপনা</h4>
            <p class="text-muted small mb-0">ক্লাস ভিত্তিক একক অথবা পেপারভিত্তিক সাবজেক্ট পরিচালনা করুন।</p>
        </div>
        <button type="button" class="btn btn-primary rounded-pill px-4 shadow-sm" data-bs-toggle="modal" data-bs-target="#addSubjectModal">
            <i class="fa-solid fa-plus me-2"></i> নতুন সাবজেক্ট যুক্ত করুন
        </button>
    </div>

    <!-- Filter Card -->
    <div class="card border-0 shadow-sm rounded-4 mb-4">
        <div class="card-body">
            <form action="{{ route('institution.subjects.index') }}" method="GET" class="row g-3 align-items-center">
                <div class="col-md-4">
                    <label class="form-label fw-bold small">ক্লাস অনুযায়ী ফিল্টার করুন</label>
                    <select name="class_id" class="form-select rounded-3" onchange="this.form.submit()">
                        <option value="">সকল ক্লাস</option>
                        @foreach($classes as $cls)
                            <option value="{{ $cls->id }}" {{ request('class_id') == $cls->id ? 'selected' : '' }}>{{ $cls->name }}</option>
                        @endforeach
                    </select>
                </div>
            </form>
        </div>
    </div>

    <!-- Subjects Table -->
    <div class="card border-0 shadow-sm rounded-4">
        <div class="card-body p-0">
            <div class="table-responsive">
                <table class="table table-hover align-middle mb-0">
                    <thead class="bg-light text-secondary small text-uppercase">
                        <tr>
                            <th class="ps-4">#</th>
                            <th>সাবজেক্টের নাম</th>
                            <th>বাংলা নাম</th>
                            <th>কোড</th>
                            <th>ক্লাস</th>
                            <th>ধরন</th>
                            <th>পত্রসমূহ ও কোড (Papers)</th>
                            <th>স্ট্যাটাস</th>
                            <th class="text-end pe-4">অ্যাকশন</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($subjects as $key => $subject)
                        <tr>
                            <td class="ps-4 fw-bold">{{ $subjects->firstItem() + $key }}</td>
                            <td class="fw-semibold text-primary">
                                {{ $subject->name }}
                                @if($subject->has_parts)
                                    <span class="badge bg-info bg-opacity-10 text-info ms-1">১ম ও ২য় পত্র</span>
                                @endif
                            </td>
                            <td>{{ $subject->bn_name ?? 'N/A' }}</td>
                            <td>{{ $subject->code ?? 'N/A' }}</td>
                            <td><span class="badge bg-light text-dark border">{{ $subject->institutionClass->name ?? 'N/A' }}</span></td>
                            <td><span class="badge bg-secondary bg-opacity-10 text-secondary text-uppercase small">{{ $subject->type }}</span></td>
                            <td>
                                @if($subject->has_parts && $subject->childPapers->count() > 0)
                                    <ul class="list-unstyled small mb-0 text-muted">
                                        @foreach($subject->childPapers as $paper)
                                            <li>• {{ $paper->name }} <span class="badge bg-light border text-dark ms-1">কোড: {{ $paper->code }}</span></li>
                                        @endforeach
                                    </ul>
                                @else
                                    <span class="text-muted small">একক বিষয়</span>
                                @endif
                            </td>
                            <td>
                                @if($subject->status)
                                    <span class="badge bg-success bg-opacity-10 text-success px-3 py-2 rounded-pill">সক্রিয়</span>
                                @else
                                    <span class="badge bg-danger bg-opacity-10 text-danger px-3 py-2 rounded-pill">নিষ্ক্রিয়</span>
                                @endif
                            </td>
                            <td class="text-end pe-4">
                                <button type="button" class="btn btn-sm btn-light text-primary me-1 rounded-3 shadow-sm" data-bs-toggle="modal" data-bs-target="#editSubjectModal{{ $subject->id }}">
                                    <i class="fa-solid fa-pen-to-square"></i>
                                </button>
                                <form action="{{ route('institution.subjects.destroy', $subject->id) }}" method="POST" class="d-inline delete-form">
                                    @csrf
                                    @method('DELETE')
                                    <button type="submit" class="btn btn-sm btn-light text-danger rounded-3 shadow-sm">
                                        <i class="fa-solid fa-trash"></i>
                                    </button>
                                </form>
                            </td>
                        </tr>

                      
                      
                        <!-- Edit Modal -->
                        <div class="modal fade" id="editSubjectModal{{ $subject->id }}" tabindex="-1" aria-hidden="true">
                            <div class="modal-dialog modal-dialog-centered">
                                <div class="modal-content border-0 rounded-4 shadow">
                                    <div class="modal-header border-0 pb-0">
                                        <h5 class="fw-bold">সাবজেক্ট আপডেট করুন</h5>
                                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                    </div>
                                    <form action="{{ route('institution.subjects.update', $subject->id) }}" method="POST">
                                        @csrf
                                        @method('PUT')
                                        <div class="modal-body text-start">
                                            <div class="mb-3">
                                                <label class="form-label fw-bold small">ক্লাস নির্বাচন করুন <span class="text-danger">*</span></label>
                                                <select name="institution_class_id" class="form-select rounded-3" required>
                                                    @foreach($classes as $cls)
                                                        <option value="{{ $cls->id }}" {{ $subject->institution_class_id == $cls->id ? 'selected' : '' }}>{{ $cls->name }}</option>
                                                    @endforeach
                                                </select>
                                            </div>
                                            <div class="mb-3">
                                                <label class="form-label fw-bold small">সাবজেক্টের নাম <span class="text-danger">*</span></label>
                                                <input type="text" name="name" class="form-control rounded-3" value="{{ $subject->name }}" required>
                                            </div>
                                            <div class="mb-3">
                                                <label class="form-label fw-bold small">বাংলা নাম</label>
                                                <input type="text" name="bn_name" class="form-control rounded-3" value="{{ $subject->bn_name }}">
                                            </div>

                                            @php
                                                $p1 = $subject->childPapers->where('paper_no', 1)->first();
                                                $p2 = $subject->childPapers->where('paper_no', 2)->first();
                                            @endphp

                                            <!-- একক সাবজেক্ট কোড ফিল্ড -->
                                            <div class="mb-3 edit-single-code" style="{{ $subject->has_parts ? 'display: none;' : '' }}">
                                                <label class="form-label fw-bold small">সাবজেক্ট কোড</label>
                                                <input type="text" name="code" class="form-control rounded-3" value="{{ $subject->code }}">
                                            </div>

                                            <!-- ১ম ও ২য় পত্রের কোড ফিল্ড -->
                                            <div class="edit-paper-codes" style="{{ $subject->has_parts ? '' : 'display: none;' }}">
                                                <div class="row bg-light p-3 rounded-3 border mb-3">
                                                    <div class="col-md-6 mb-2">
                                                        <label class="form-label fw-bold small">১ম পত্রের কোড</label>
                                                        <input type="text" name="paper_1_code" class="form-control rounded-3" value="{{ $p1->code ?? '' }}">
                                                    </div>
                                                    <div class="col-md-6 mb-2">
                                                        <label class="form-label fw-bold small">২য় পত্রের কোড</label>
                                                        <input type="text" name="paper_2_code" class="form-control rounded-3" value="{{ $p2->code ?? '' }}">
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="mb-3">
                                                <label class="form-label fw-bold small">পরীক্ষার ধরন <span class="text-danger">*</span></label>
                                                <select name="type" class="form-select rounded-3" required>
                                                    <option value="theory_mcq" {{ $subject->type == 'theory_mcq' ? 'selected' : '' }}>Theory & MCQ</option>
                                                    <option value="theory_practical" {{ $subject->type == 'theory_practical' ? 'selected' : '' }}>Theory & Practical</option>
                                                    <option value="all" {{ $subject->type == 'all' ? 'selected' : '' }}>All (Theory, MCQ & Practical)</option>
                                                    <option value="theory" {{ $subject->type == 'theory' ? 'selected' : '' }}>Theory Only</option>
                                                    <option value="practical" {{ $subject->type == 'practical' ? 'selected' : '' }}>Practical Only</option>
                                                    <option value="mcq" {{ $subject->type == 'mcq' ? 'selected' : '' }}>MCQ Only</option>
                                                </select>
                                            </div>

                                            <div class="form-check form-switch mt-3 mb-2 bg-light p-3 rounded-3 border">
                                                <input class="form-check-input ms-0 me-2 edit-has-parts-check" type="checkbox" name="has_parts" id="editHasPartsCheck{{ $subject->id }}" value="1" {{ $subject->has_parts ? 'checked' : '' }} data-id="{{ $subject->id }}">
                                                <label class="form-check-label fw-bold small" for="editHasPartsCheck{{ $subject->id }}">এই সাবজেক্টের ১ম ও ২য় পত্র রয়েছে কি?</label>
                                            </div>

                                            <div class="form-check form-switch">
                                                <input class="form-check-input" type="checkbox" name="status" id="editStatus{{ $subject->id }}" value="1" {{ $subject->status ? 'checked' : '' }}>
                                                <label class="form-check-label fw-bold small" for="editStatus{{ $subject->id }}">সক্রিয় রাখুন</label>
                                            </div>
                                        </div>
                                        <div class="modal-footer border-0 pt-0">
                                            <button type="button" class="btn btn-light rounded-pill px-4" data-bs-dismiss="modal">বাতিল</button>
                                            <button type="submit" class="btn btn-primary rounded-pill px-4">আপডেট করুন</button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                        @empty
                        <tr>
                            <td colspan="9" class="text-center py-4 text-muted">কোনো সাবজেক্ট পাওয়া যায়নি।</td>
                        </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
        @if($subjects->hasPages())
        <div class="card-footer bg-white border-0 py-3">
            {{ $subjects->links() }}
        </div>
        @endif
    </div>
</div>

<!-- Add Modal -->
<div class="modal fade" id="addSubjectModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content border-0 rounded-4 shadow">
            <div class="modal-header border-0 pb-0">
                <h5 class="fw-bold">নতুন সাবজেক্ট যুক্ত করুন</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form action="{{ route('institution.subjects.store') }}" method="POST">
                @csrf
                <div class="modal-body text-start">
                    <div class="mb-3">
                        <label class="form-label fw-bold small">ক্লাস নির্বাচন করুন <span class="text-danger">*</span></label>
                        <select name="institution_class_id" class="form-select rounded-3" required>
                            <option value="">-- ক্লাস সিলেক্ট করুন --</option>
                            @foreach($classes as $cls)
                                <option value="{{ $cls->id }}">{{ $cls->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="mb-3">
                        <label class="form-label fw-bold small">সাবজেক্টের নাম (যেমন: Physics) <span class="text-danger">*</span></label>
                        <input type="text" name="name" class="form-control rounded-3" placeholder="যেমন: Physics" required>
                    </div>
                    <div class="mb-3">
                        <label class="form-label fw-bold small">বাংলা নাম (যেমন: পদার্থবিজ্ঞান)</label>
                        <input type="text" name="bn_name" class="form-control rounded-3" placeholder="যেমন: পদার্থবিজ্ঞান">
                    </div>

                    <!-- একক সাবজেক্ট কোড -->
                    <div class="mb-3" id="singleCodeField">
                        <label class="form-label fw-bold small">সাবজেক্ট কোড</label>
                        <input type="text" name="code" class="form-control rounded-3" placeholder="যেমন: 109 বা 154">
                    </div>

                    <!-- ১য় ও ২য় পত্রের আলাদা কোড ফিল্ড -->
                    <div id="paperCodeFields" style="display: none;">
                        <div class="row bg-light p-3 rounded-3 border mb-3">
                            <div class="col-md-6 mb-2">
                                <label class="form-label fw-bold small">১ম পত্রের কোড <span class="text-danger">*</span></label>
                                <input type="text" name="paper_1_code" class="form-control rounded-3" placeholder="যেমন: 174">
                            </div>
                            <div class="col-md-6 mb-2">
                                <label class="form-label fw-bold small">২য় পত্রের কোড <span class="text-danger">*</span></label>
                                <input type="text" name="paper_2_code" class="form-control rounded-3" placeholder="যেমন: 175">
                            </div>
                        </div>
                    </div>

                    <div class="mb-3">
                        <label class="form-label fw-bold small">পরীক্ষার ধরন <span class="text-danger">*</span></label>
                        <select name="type" class="form-select rounded-3" required>
                            <option value="theory_mcq">Theory & MCQ</option>
                            <option value="theory_practical">Theory & Practical</option>
                            <option value="all">All (Theory, MCQ & Practical)</option>
                            <option value="theory">Theory Only</option>
                            <option value="practical">Practical Only</option>
                            <option value="mcq">MCQ Only</option>
                        </select>
                    </div>
                    <div class="form-check form-switch mt-3 mb-2 bg-light p-3 rounded-3 border">
                        <input class="form-check-input ms-0 me-2" type="checkbox" name="has_parts" id="hasPartsCheck" value="1">
                        <label class="form-check-label fw-bold small" for="hasPartsCheck">এই সাবজেক্টের ১ম ও ২য় পত্র রয়েছে কি?</label>
                    </div>
                    <div class="form-check form-switch">
                        <input class="form-check-input" type="checkbox" name="status" id="addStatus" value="1" checked>
                        <label class="form-check-label fw-bold small" for="addStatus">সক্রিয় রাখুন</label>
                    </div>
                </div>
                <div class="modal-footer border-0 pt-0">
                    <button type="button" class="btn btn-light rounded-pill px-4" data-bs-dismiss="modal">বাতিল</button>
                    <button type="submit" class="btn btn-primary rounded-pill px-4">সংরক্ষণ করুন</button>
                </div>
            </form>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
    // অ্যাড মডালে পেপার চেক বক্স টগল
    $('#hasPartsCheck').on('change', function() {
        if ($(this).is(':checked')) {
            $('#singleCodeField').hide();
            $('#paperCodeFields').show();
            $('input[name="code"]').val('');
        } else {
            $('#singleCodeField').show();
            $('#paperCodeFields').hide();
            $('input[name="paper_1_code"]').val('');
            $('input[name="paper_2_code"]').val('');
        }
    });

    // এডিট মডালে পেপার চেক বক্স ডাইনামিক টগল
    $(document).on('change', '.edit-has-parts-check', function() {
        let modalBody = $(this).closest('.modal-body');
        if ($(this).is(':checked')) {
            modalBody.find('.edit-single-code').hide();
            modalBody.find('.edit-paper-codes').show();
            modalBody.find('input[name="code"]').val('');
        } else {
            modalBody.find('.edit-single-code').show();
            modalBody.find('.edit-paper-codes').hide();
            modalBody.find('input[name="paper_1_code"]').val('');
            modalBody.find('input[name="paper_2_code"]').val('');
        }
    });

    $(document).on('submit', '.delete-form', function(e) {
        e.preventDefault();
        let form = this;

        Swal.fire({
            title: 'আপনি কি নিশ্চিত?',
            text: "এই সাবজেক্ট ও এর অধীনস্থ পেপারগুলো স্থায়ীভাবে মুছে যাবে!",
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#dc3545',
            cancelButtonColor: '#6c757d',
            confirmButtonText: 'হ্যাঁ, মুছে ফেলুন!',
            cancelButtonText: 'বাতিল'
        }).then((result) => {
            if (result.isConfirmed) {
                form.submit();
            }
        });
    });
</script>
@endpush