feat: add ClubRole selection in election Role form

election/templates/election/role_form.jinja

@@ -0,0 +1,53 @@
+{% extends "core/base.jinja" %}
+
+{% block title %}
+  {% trans name=object_name %}Election role{% endtrans %}
+{% endblock %}
+
+{% block content %}
+  {% if object %}
+    <h1>{% trans election=election %}Create role for election "{{ election }}"{% endtrans %}</h1>
+  {% else %}
+    <h1>{% trans election=election %}Edit role for election "{{ election }}"{% endtrans %}</h1>
+  {% endif %}
+  <form action="" method="post" x-data="{role: null, title: '', description: ''}">
+    {% csrf_token %}
+    <div class="form-group">
+      {{ form.club_role.label_tag() }}
+      {{ form.club_role.errors }}
+      {{ form.club_role|add_attr("x-model.fill=role,autofocus=true") }}
+      <button
+        class="btn btn-blue"
+        @click.prevent="title = roles[role]?.title ?? '';
+                        description = roles[role]?.description ?? '';"
+      >
+        {% trans %}autofill form{% endtrans %}
+      </button>
+      <span class="helptext">{{ form.club_role.help_text }}</span>
+    </div>
+    <div class="form-group">
+      {{ form.title.label_tag() }}
+      {{ form.title.errors }}
+      {{ form.title|add_attr("x-model.fill=title") }}
+    </div>
+    <div class="form-group">
+      {{ form.description.label_tag() }}
+      {{ form.description.errors }}
+      {{ form.description|add_attr("x-model.fill=description") }}
+    </div>
+    <div class="form-group">
+      {{ form.max_choice.as_field_group() }}
+    </div>
+    <p><input type="submit" value="{% trans %}Save{% endtrans %}" /></p>
+  </form>
+{% endblock %}
+
+{% block script %}
+  <script>
+    const roles = {
+      {%- for role in form.club_role.field.queryset -%}
+        {{ role.id }}: { title: {{ role.name|tojson }}, description: {{ role.description|tojson }} },
+      {%- endfor -%}
+    };
+  </script>
+{% endblock %}