Initial commit

resources/views/admin/sections/show.blade.php

@@ -0,0 +1,126 @@
+<x-app-layout>
+    <div class="py-12">
+        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
+            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
+                <div class="p-6 text-gray-900">
+                    <h1 class="text-2xl font-bold mb-6">
+                        Manage Course: {{ $course->subject->name }} ({{ $course->level->name }})
+                    </h1>
+
+
+
+{{-- Show ONLY the module this section belongs to --}}
+<div class="mb-6">
+    <h2 class="text-xl font-semibold mb-2">
+        {{ $section->module->name }}
+    </h2>
+
+    <div class="ml-4 mb-6">
+        <h3 class="text-lg font-semibold mb-2">
+            Chapters ({{ $section->title }})
+        </h3>
+
+        {{-- Reorder form --}}
+        <form action="{{ route('admin.chapters.reorder') }}"
+              method="POST"
+              id="reorderForm-{{ $section->id }}">
+            @csrf
+
+            <ul id="chapter-list-{{ $section->id }}"
+                class="border rounded mb-3 divide-y divide-gray-200 sortable-item">
+
+                @foreach($section->chapters->sortBy('order') as $chapter)
+                    <li class="flex items-center justify-between px-3 py-2 hover:bg-gray-50"
+                        data-id="{{ $chapter->id }}">
+
+                        <div class="flex items-center gap-2">
+                            <span class="cursor-move text-gray-400 select-none">⋮⋮</span>
+
+                            <a href="{{ route('admin.chapters.show', [
+                                'course' => $course->slug,
+                                'chapter' => $chapter->slug
+                            ]) }}"
+                               class="text-blue-600 hover:underline">
+                                {{ $chapter->title }}
+                            </a>
+                        </div>
+
+                        <button type="button"
+                                onclick="if (confirmDelete('{{ $chapter->title }}')) { 
+                                    document.getElementById('delete-form-{{ $chapter->id }}').submit();
+                                }"
+                                class="text-red-600 hover:text-red-800">
+                            ✖
+                        </button>
+                    </li>
+                @endforeach
+
+            </ul>
+
+            <input type="hidden" name="order" id="orderInput-{{ $section->id }}">
+
+            <button type="submit"
+                    class="px-3 py-1 bg-blue-100 text-blue-700 rounded hover:bg-blue-200 text-sm font-medium">
+                💾 Save Order
+            </button>
+        </form>
+
+        {{-- Delete forms --}}
+        @foreach($section->chapters as $chapter)
+            <form id="delete-form-{{ $chapter->id }}"
+                  action="{{ route('admin.chapters.destroy', $chapter->id) }}"
+                  method="POST"
+                  class="hidden">
+                @csrf
+                @method('DELETE')
+            </form>
+        @endforeach
+
+        {{-- Add Chapter --}}
+        <form action="{{ route('admin.chapters.store') }}" method="POST" class="mt-4 flex gap-2">
+            @csrf
+            <input type="hidden" name="lesson_section_id" value="{{ $section->id }}">
+
+            <input type="text"
+                   name="title"
+                   class="flex-1 border-gray-300 rounded-md shadow-sm focus:ring-blue-200"
+                   placeholder="New Chapter Title"
+                   required>
+
+            <button type="submit"
+                    class="px-3 py-1 bg-green-100 text-green-700 rounded hover:bg-green-200 text-sm font-medium">
+                ➕ Add
+            </button>
+        </form>
+    </div>
+</div>
+
+
+                </div>
+            </div>
+        </div>
+    </div>
+</x-app-layout>
+
+<script src="https://cdn.jsdelivr.net/npm/sortablejs@1.15.0/Sortable.min.js"></script>
+<script>
+    document.querySelectorAll('[id^="chapter-list-"]').forEach(list => {
+        new Sortable(list, { animation: 150 });
+
+        const sectionId = list.id.replace('chapter-list-', '');
+        const form = document.getElementById('reorderForm-' + sectionId);
+        const hiddenInput = document.getElementById('orderInput-' + sectionId);
+
+        form.addEventListener('submit', function () {
+            const ids = Array.from(list.querySelectorAll('li')).map(li => li.dataset.id);
+            hiddenInput.value = JSON.stringify(ids);
+        });
+    });
+
+    function confirmDelete(title) {
+        return confirm(
+            `Are you sure you want to delete the chapter "${title}"?\n\n` +
+            `⚠️ This will also remove all topics and videos inside it.`
+        );
+    }
+</script>