Kategorie_mit_Farbpunkt

2025-07-04 13:56:32 +02:00
parent d929e6b5dd
commit 37f4a7b868
6 changed files with 102 additions and 7 deletions
--- a/django/library/admin.py
+++ b/django/library/admin.py
@@ -30,10 +30,35 @@ class QuizImageAdmin(admin.ModelAdmin):
 class QuestionImageAdmin(admin.ModelAdmin):
     list_display = ('image',)  

+
+from django import forms
+from .models import QuizCategory
+
+class QuizCategoryForm(forms.ModelForm):
+    color = forms.CharField(
+        widget=forms.TextInput(attrs={'type': 'color'})
+    )
+
+    class Meta:
+        model = QuizCategory
+        fields = '__all__'
+from django.utils.html import format_html
+@admin.register(QuizCategory)
+class QuizCategoryAdmin(admin.ModelAdmin):
+    form = QuizCategoryForm
+    list_display = ('name', 'color_preview', 'color')
+
+    def color_preview(self, obj):
+        return format_html(
+            '<div style="width: 24px; height: 24px; background-color: {}; border: 2px solid #000;"></div>',
+            obj.color
+        )
+    color_preview.short_description = "Farbe"       
+        
 # Registrierung der Modelle im Admin
 admin.site.register(QivipQuiz, QivipQuizAdmin)
 admin.site.register(QivipQuestion, QivipQuestionAdmin)
-admin.site.register(QuizCategory, QuizCategoryAdmin)
+#admin.site.register(QuizCategory, QuizCategoryAdmin)
 admin.site.register(QivipQuizFavorite, QivipQuizFavoriteAdmin)
 admin.site.register(QuizImage, QuizImageAdmin)
 admin.site.register(QuestionImage, QuestionImageAdmin)
--- a/django/library/migrations/0057_quizcategory_color.py
+++ b/django/library/migrations/0057_quizcategory_color.py
@@ -0,0 +1,18 @@
+# Generated by Django 5.1.7 on 2025-07-02 11:31
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('library', '0056_alter_quizrating_unique_together'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='quizcategory',
+            name='color',
+            field=models.CharField(default='#000000', help_text='Farbe als Hex-Code, z.B. #ff0000', max_length=7),
+        ),
+    ]
--- a/django/library/models.py
+++ b/django/library/models.py
@@ -148,6 +148,12 @@ class QuizCategory(models.Model):
    name = models.CharField(max_length=100, unique=True)
    description = models.TextField(blank=True, null=True)
    slug = models.SlugField(unique=True, blank=True)
+    color= models.CharField(
+        max_length=7,
+        default="#000000",
+        help_text="Farbe als Hex-Code, z.B. #ff0000"
+    )
+

    def save(self, *args, **kwargs):
        if not self.slug:
--- a/django/templates/library/overview_quiz.html
+++ b/django/templates/library/overview_quiz.html
@@ -19,19 +19,27 @@

 <!-- Alle -->
 <div class="container mx-auto px-4 sm:px-6 lg:px-8 mt-8 mb-6">
-    {% if user.is_authenticated %}
+   

      <div class="flex justify-end  text-sm mb-2">
      <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6 text-blue-600">
      <path stroke-linecap="round" stroke-linejoin="round" d="m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z" />
      </svg>
      <div class="gap-2 mx-2">
+      {% if user.is_authenticated %}
      Anzahl aller Ergebnisse:
      <span class="font-bold"> {{ total_all_found }}</span>
      </div>
      (verschiedene: 
-      <span class="font-bold ml-1"> {{ total_all }}</span>) </div>
-        
+      <span class="font-bold ml-1"> {{ total_all }}</span>)
+      {% else %}
+      Anzahl aller Ergebnisse:
+      <span class="font-bold"> {{ total_all_found }}</span>
+      </div>
+       {% endif %}
+      </div>
+     
+        {% if user.is_authenticated %}
    <div class="flex flex-wrap justify-end gap-4 font-bold text-blue-600 whitespace-nowrap text-sm mb-2 md:mb-0">
        <p class="font-black underline">Alle ({{ total_all }})</p>
    <a href="{{ url_my }}?{{ request.GET.urlencode }}">Meine Quizze ({{ total_my }})</a>
@@ -52,7 +60,7 @@
 <div class="container mx-auto px-4 sm:px-6 lg:px-8">
  <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6 auto-rows-fr">
    {% for quiz in all_quizzes %}
-    <article class="relative min-h-[20rem] rounded-xl shadow-lg overflow-hidden bg-white flex flex-col">
+    <article class="relative min-h-[20rem] rounded-xl shadow-lg overflow-hidden flex flex-col">
        <!-- Image Section (Top) -->
        <div class="h-48 w-full relative flex-shrink-0">
          {% if quiz.image %}
@@ -89,10 +97,21 @@
          </div>
          {% endif %}
          {% endif %}
+                    <div class="max-w-6/10 h-max-12 truncate absolute top-4 left-4 bg-white bg-opacity-60 text-white px-4 py-2 rounded-lg shadow-lg ">
+           
+            <div  class="flex items-center gap-2">
+          <span class="rounded-full w-4 h-4 flex-shrink-0" style="background-color: {{ quiz.category.color }};"></span>
+             <a class=" text-gray-800 truncate text-sm" title="{{ quiz.category }}" href="{% url 'library:overview_quiz' %}?filter=1&categories={{ quiz.category.id }}">{{ quiz.category }}</a>
+            </div>
+          </div>
+
+
+
+
        </div>

        <!-- Content Section (Bottom) -->
-        <div class="flex-grow bg-white p-4 flex flex-col gap-3">
+        <div class="flex-grow bg-white p-4 flex flex-col gap-3"  >
          <!-- Title -->
          <h2 class="text-xl font-bold text-gray-900 break-words mb-2"> 
            <a href="{% url 'library:detail_quiz' quiz.id %}" class="hover:text-blue-600 transition-colors">{{ quiz.name }}</a>
@@ -125,6 +144,9 @@
              </svg>
              <span class="text-gray-800">{{ quiz.status }}</span>
            </div>
+
+
+
            


@@ -171,7 +193,7 @@


          <!-- Action Buttons -->
-          <div class="flex justify-between items-center gap-2 mt-3 border-t pt-3">
+          <div class="flex justify-between items-center gap-2 mt-3 border-t pt-3"  >
            {% if quiz.questions.count != 0 %}
            <a href="{% url 'play:create_game' quiz.id %}" 
               class="px-3 py-1.5 bg-blue-600 hover:bg-blue-700 text-white text-sm font-medium rounded-lg transition-colors duration-200 flex items-center gap-2">
--- a/django/templates/library/overview_quiz_favorite.html
+++ b/django/templates/library/overview_quiz_favorite.html
@@ -91,6 +91,18 @@
          </div>
          {% endif %}
          {% endif %}
+                    <div class="max-w-6/10 h-max-12 truncate absolute top-4 left-4 bg-white bg-opacity-60 text-white px-4 py-2 rounded-lg shadow-lg ">
+           
+            <div  class="flex items-center gap-2">
+          <span class="rounded-full w-4 h-4 flex-shrink-0" style="background-color: {{ quiz.category.color }};"></span>
+           
+              <a class=" text-gray-800 truncate text-sm" title="{{ quiz.category }}" href="{% url 'library:overview_quiz' %}?filter=1&categories={{ quiz.category.id }}">{{ quiz.category }}</a>
+            </div>
+          </div>
+
+
+
+
        </div>

        
--- a/django/templates/library/overview_quiz_my.html
+++ b/django/templates/library/overview_quiz_my.html
@@ -70,6 +70,8 @@
          {% if user.is_authenticated %}
          {% if quiz.id not in favorite_quiz_ids %}
          <div class="absolute top-4 right-4 bg-white bg-opacity-60 text-white px-4 py-2 rounded-lg shadow-lg">
+
+            
           
            <a class="favorite-link" href="{% url 'library:favorite_quiz' quiz.pk %}">
            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="text-black size-6">
@@ -88,6 +90,16 @@
          </div>
          {% endif %}
          {% endif %}
+                    <div class="max-w-6/10 h-max-12 truncate absolute top-4 left-4 bg-white bg-opacity-60 text-white px-4 py-2 rounded-lg shadow-lg ">
+           
+            <div  class="flex items-center gap-2">
+          <span class="rounded-full w-4 h-4 flex-shrink-0" style="background-color: {{ quiz.category.color }};"></span>
+            <a class=" text-gray-800 truncate text-sm" title="{{ quiz.category }}" href="{% url 'library:overview_quiz' %}?filter=1&categories={{ quiz.category.id }}">{{ quiz.category }}</a>
+            </div>
+          </div>
+
+
+
        </div>