Initial commit

resources/views/admin/projects/form.edge

@@ -0,0 +1,120 @@
+@component('admin/layouts/main')
+  @slot('main')
+    <h1 class="text-2xl font-bold mb-6">{{ project ? 'Modifier le projet' : 'Nouveau projet' }}</h1>
+    <form action="{{ project ? `/admin/projects/${project.id}` : '/admin/projects' }}" method="post" class="bg-white p-6 rounded shadow max-w-2xl">
+      {{{ csrfField() }}}
+      <div class="space-y-4">
+        <div>
+          <label for="title" class="block text-sm font-medium text-gray-700 mb-1">Titre</label>
+          <input type="text" name="title" id="title" value="{{ project?.title || '' }}" required
+            class="w-full px-3 py-2 border rounded" />
+        </div>
+        <div>
+          <label for="content" class="block text-sm font-medium text-gray-700 mb-1">Contenu (Markdown)</label>
+          <textarea name="content" id="content" rows="8" class="w-full px-3 py-2 border rounded">{{ project?.content || '' }}</textarea>
+        </div>
+        <div class="grid grid-cols-2 gap-4">
+          <div>
+            <label for="start" class="block text-sm font-medium text-gray-700 mb-1">Début</label>
+            <input type="date" name="start" id="start" value="{{ project?.start ? project.start.toISODate() : '' }}"
+              class="w-full px-3 py-2 border rounded" />
+          </div>
+          <div>
+            <label for="end" class="block text-sm font-medium text-gray-700 mb-1">Fin</label>
+            <input type="date" name="end" id="end" value="{{ project?.end ? project.end.toISODate() : '' }}"
+              class="w-full px-3 py-2 border rounded" />
+          </div>
+        </div>
+        <div>
+          <label for="thumbnailUrl" class="block text-sm font-medium text-gray-700 mb-1">Image miniature</label>
+          <div x-data="{ open: false, selected: '{{ project?.thumbnailUrl || '' }}' }" class="relative">
+            <input type="hidden" name="thumbnailUrl" x-model="selected">
+            
+            <button type="button" @click="open = !open" class="w-full px-3 py-2 border rounded text-left flex items-center justify-between bg-white">
+              <span x-text="selected ? selected.split('/').pop() : 'Sélectionner une image'"></span>
+              <svg class="w-4 h-4 text-gray-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg>
+            </button>
+
+            <div x-show="open" @click.away="open = false" class="absolute z-10 w-full mt-1 bg-white border rounded shadow-lg max-h-60 overflow-y-auto grid grid-cols-3 gap-2 p-2">
+              <div @click="selected = ''; open = false" class="col-span-3 p-2 hover:bg-gray-100 cursor-pointer text-sm text-gray-500 text-center border-b mb-2">
+                Aucune image
+              </div>
+              @each(image in images)
+                <div @click="selected = '{{ image.filePath }}'; open = false" class="cursor-pointer group relative aspect-square border rounded overflow-hidden hover:border-blue-500" :class="{'ring-2 ring-blue-500': selected === '{{ image.filePath }}'}">
+                  <img src="{{ image.filePath }}" alt="{{ image.originalName }}" class="w-full h-full object-cover">
+                  <div class="absolute inset-0 bg-black/50 opacity-0 group-hover:opacity-100 flex items-center justify-center text-white text-xs p-1 text-center transition-opacity">
+                    {{ image.originalName }}
+                  </div>
+                </div>
+              @endeach
+            </div>
+            
+            <!-- Preview of selected image -->
+            <template x-if="selected">
+              <div class="mt-2">
+                <p class="text-xs text-gray-500 mb-1">Aperçu:</p>
+                <img :src="selected" class="h-24 w-auto object-contain border rounded bg-gray-50">
+              </div>
+            </template>
+          </div>
+        </div>
+        <div>
+          <label for="categoryId" class="block text-sm font-medium text-gray-700 mb-1">Catégorie</label>
+          <select name="categoryId" id="categoryId" class="w-full px-3 py-2 border rounded">
+            <option value="">—</option>
+            @each(cat in categories)
+              <option value="{{ cat.id }}" {{ project?.categoryId === cat.id ? 'selected' : '' }}>{{ cat.name }}</option>
+            @endeach
+          </select>
+        </div>
+        <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
+            <!-- Tags Selection -->
+            <div class="bg-gray-50 p-4 rounded border" x-data="{ search: '' }">
+                <label class="block text-sm font-bold text-gray-700 mb-2 border-b pb-1">Tags</label>
+                <input type="text" x-model="search" placeholder="Rechercher..." class="w-full px-2 py-1 mb-2 border rounded text-sm mb-2">
+                <div class="max-h-60 overflow-y-auto space-y-2 pr-2">
+                    @each(tag in tags)
+                    <label class="flex items-center hover:bg-gray-100 p-1 rounded cursor-pointer transition-colors" x-show="'{{ tag.name.toLowerCase() }}'.includes(search.toLowerCase())">
+                        <input type="checkbox" name="tagIds" value="{{ tag.id }}" class="mr-2 h-4 w-4 text-blue-600 rounded border-gray-300 focus:ring-blue-500" 
+                        {{ project?.tags?.find(t => t.id === tag.id) ? 'checked' : '' }} />
+                        <span class="text-sm text-gray-700" style="color: {{ tag.color }}">{{ tag.name }}</span>
+                    </label>
+                    @endeach
+                </div>
+            </div>
+
+            <!-- Trainings Selection -->
+            <div class="bg-gray-50 p-4 rounded border">
+                <label class="block text-sm font-bold text-gray-700 mb-2 border-b pb-1">Formations</label>
+                <div class="max-h-60 overflow-y-auto space-y-2 pr-2">
+                    @each(t in trainings)
+                    <label class="flex items-center hover:bg-gray-100 p-1 rounded cursor-pointer transition-colors">
+                        <input type="checkbox" name="trainingIds" value="{{ t.id }}" class="mr-2 h-4 w-4 text-blue-600 rounded border-gray-300 focus:ring-blue-500"
+                        {{ project?.trainings?.find(tr => tr.id === t.id) ? 'checked' : '' }} />
+                        <span class="text-sm text-gray-700">{{ t.name }}</span>
+                    </label>
+                    @endeach
+                </div>
+            </div>
+
+            <!-- Experiences Selection -->
+            <div class="bg-gray-50 p-4 rounded border">
+                <label class="block text-sm font-bold text-gray-700 mb-2 border-b pb-1">Expériences</label>
+                <div class="max-h-60 overflow-y-auto space-y-2 pr-2">
+                    @each(e in experiences)
+                    <label class="flex items-center hover:bg-gray-100 p-1 rounded cursor-pointer transition-colors">
+                        <input type="checkbox" name="experienceIds" value="{{ e.id }}" class="mr-2 h-4 w-4 text-blue-600 rounded border-gray-300 focus:ring-blue-500"
+                        {{ project?.experiences?.find(exp => exp.id === e.id) ? 'checked' : '' }} />
+                        <span class="text-sm text-gray-700">{{ e.name }} - {{e.place }}</span>
+                    </label>
+                    @endeach
+                </div>
+            </div>
+        </div>
+        <button type="submit" class="bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700">
+          Enregistrer
+        </button>
+      </div>
+    </form>
+  @endslot
+@end