add selectable icon to simpleresource plugin (#856)

Author: jeriox

ephios/plugins/simpleresource/forms.py

@@ -59,5 +59,5 @@ def add_fields(self, form, index):
     formset=BaseResourceCategoryFormset,
     can_delete=True,
     extra=0,
-    fields=["name"],
+    fields=["name", "icon"],
 )

ephios/plugins/simpleresource/migrations/0002_resourcecategory_icon.py

@@ -0,0 +1,18 @@
+# Generated by Django 4.1.5 on 2023-01-02 21:41
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ("simpleresource", "0001_initial"),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name="resourcecategory",
+            name="icon",
+            field=models.CharField(default="box", max_length=50),
+        ),
+    ]

ephios/plugins/simpleresource/models.py

@@ -6,6 +6,7 @@
 
 class ResourceCategory(models.Model):
     name = models.CharField(max_length=50, verbose_name=_("Name"))
+    icon = models.CharField(max_length=50, default="box", help_text="FontAwesome icon name")
 
     def __str__(self):
         # pylint: disable=invalid-str-returned

ephios/plugins/simpleresource/templates/simpleresource/resource_allocations.html

@@ -1,5 +1,5 @@
 <div id="resource-allocation-shift-{{ allocation.shift.id }}">
     {% for resource in allocation.resources.all %}
-        <span class="badge bg-light text-dark"><i class="fas fa-box"></i> {{ resource.title }}</span>
+        <span class="badge bg-light text-dark"><i class="fas fa-{{ resource.category.icon }}"></i> {{ resource.title }}</span>
     {% endfor %}
 </div>

ephios/plugins/simpleresource/templates/simpleresource/resourcecategories_form.html

@@ -21,16 +21,19 @@ <h1>{% trans "Edit resource categories" %}</h1>
         <div class="formset" data-formset data-formset-prefix="{{ form.prefix }}">
             {{ form.management_form }}
             <div class="card mb-2">
-                <div class="card-body">
+                <div class="card-body pt-2">
                     <ul class="list-group list-group-flush" data-formset-body>
                         {% for category_form in form %}
                             <div class="list-group-item" data-formset-form>
                                 {{ category_form.id }}
-                                <div class="row align-items-center">
-                                    <div class="col-lg-10">
+                                <div class="row align-items-start">
+                                    <div class="col-lg-6 pt-3">
                                         {% crispy_field category_form.name label_class="col-lg-3" field_class="col-lg-9" wrapper_class="row" %}
                                     </div>
-                                    <div class="col-lg-2">
+                                    <div class="col-lg-4 pt-3">
+                                        {% crispy_field category_form.icon label_class="col-lg-3" field_class="col-lg-9" wrapper_class="row" %}
+                                    </div>
+                                    <div class="col-lg-2 pt-2">
                                         {% if not category_form.fields.DELETE.disabled %}
                                             <button class="btn btn-link" type="button"
                                                     data-formset-delete-button><span
@@ -60,11 +63,14 @@ <h1>{% trans "Edit resource categories" %}</h1>
                     {% escapescript %}
                         <div class="list-group-item" data-formset-form>
                             {{ category_form.id }}
-                            <div class="row align-items-center">
-                                <div class="col-lg-10">
+                            <div class="row align-items-start">
+                                <div class="col-lg-6 pt-3">
                                     {% crispy_field category_form.name label_class="col-lg-3" field_class="col-lg-9" wrapper_class="row" %}
                                 </div>
-                                <div class="col-lg-1">
+                                <div class="col-lg-4 pt-3">
+                                    {% crispy_field category_form.icon label_class="col-lg-3" field_class="col-lg-9" wrapper_class="row" %}
+                                </div>
+                                <div class="col-lg-1 pt-2">
                                     <button class="btn btn-link" type="button"
                                             data-formset-delete-button><span
                                             class="fas fa-trash-alt"></span> {% trans "Delete" %}</button>