@extends('layouts.master')

@section('title', 'Training Subjects')

@section('content')

<div class="flex justify-between items-center mb-6">

    <div>
        <h2 class="text-2xl font-bold">
            Training Subjects
        </h2>
        <p class="text-gray-500">
            Manage Training Subjects
        </p>
    </div>

    <a href="{{ route('training-subjects.create') }}"
       class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg">

        + Add Training Subject

    </a>

</div>


@if(session('success'))

<div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded mb-4">

    {{ session('success') }}

</div>

@endif


<div class="bg-white rounded-lg shadow">

    <div class="p-4 border-b">

        <form method="GET">

            <div class="flex gap-3">

                <input
                    type="text"
                    name="search"
                    value="{{ request('search') }}"
                    placeholder="Search Subject Name / Code..."
                    class="border rounded-lg px-3 py-2 w-80">

                <button
                    class="bg-gray-700 text-white px-4 rounded">

                    Search

                </button>

                <a
                    href="{{ route('training-subjects.index') }}"
                    class="bg-gray-300 px-4 py-2 rounded">

                    Reset

                </a>

            </div>

        </form>

    </div>


    <table class="min-w-full">

        <thead class="bg-gray-100">

        <tr>

            <th class="px-4 py-3 text-left">Code</th>

            <th class="px-4 py-3 text-left">Subject Name</th>

            <th class="px-4 py-3 text-left">Description</th>

            <th class="px-4 py-3 text-center">Status</th>

            <th class="px-4 py-3 text-center">Action</th>

        </tr>

        </thead>

        <tbody>

        @forelse($subjects as $subject)

        <tr class="border-t">

            <td class="px-4 py-3">

                {{ $subject->subject_code }}

            </td>

            <td class="px-4 py-3">

                {{ $subject->subject_name }}

            </td>

            <td class="px-4 py-3">

                {{ $subject->description }}

            </td>

            <td class="px-4 py-3 text-center">

                @if($subject->status)

                    <span class="bg-green-100 text-green-700 px-2 py-1 rounded">

                        Active

                    </span>

                @else

                    <span class="bg-red-100 text-red-700 px-2 py-1 rounded">

                        Inactive

                    </span>

                @endif

            </td>

            <td class="px-4 py-3 text-center">

                <a
                    href="{{ route('training-subjects.edit',$subject) }}"
                    class="text-blue-600 hover:underline">

                    Edit

                </a>

                |

                <form
                    action="{{ route('training-subjects.destroy',$subject) }}"
                    method="POST"
                    class="inline">

                    @csrf
                    @method('DELETE')

                    <button
                        onclick="return confirm('Delete this Training Subject?')"
                        class="text-red-600 hover:underline">

                        Delete

                    </button>

                </form>

            </td>

        </tr>

        @empty

        <tr>

            <td colspan="5" class="text-center py-6 text-gray-500">

                No Training Subjects Found

            </td>

        </tr>

        @endforelse

        </tbody>

    </table>

</div>


<div class="mt-5">

    {{ $subjects->links() }}

</div>

@endsection