WIP: Rebuild event registration form in vue

aleksis/apps/paweljong/frontend/components/event/events.graphql

+query eventById($id: ID!) {
+  eventById(id: $id) {
+    id
+    displayName
+    description
+    cost
+    minCost
+    maxCost
+    terms {
+      id
+    }
+    additionalFields {
+      id
+    }
+  }
+}
+
+query eventBySlug($slug: String!) {
+  event: eventBySlug(slug: $slug) {
+    id
+    displayName
+    description
+    cost
+    minCost
+    maxCost
+    terms {
+      id
+      title
+      term
+      confirmationText
+    }
+    additionalFields {
+      id
+      title
+      fieldType
+      required
+      helpText
+    }
+    contactInformationVisibleFields
+  }
+}

aleksis/apps/paweljong/frontend/components/event_additional_field/eventAdditionalFieldMixin.js

+/**
+ * Vue mixin containing code getting the respective vue component for event additional fields.
+ *
+ * Only used by event registration form, but factored out for readability.
+ */
+
+// TODO: add some more rule checking (e.g. for emails)
+
+import DateField from "aleksis.core/components/generic/forms/DateField.vue";
+import DateTimeField from "aleksis.core/components/generic/forms/DateTimeField.vue";
+import TimeField from "aleksis.core/components/generic/forms/TimeField.vue";
+import PositiveSmallIntegerField from "aleksis.core/components/generic/forms/PositiveSmallIntegerField.vue";
+
+const eventAdditionalFieldMixin = {
+  methods: {
+    fieldComponentForAdditionalField(additionalField) {
+      if (additionalField.fieldType == "CHARFIELD" || additionalField.fieldType == "EMAILFIELD" || additionalField.fieldType == "URLFIELD" || additionalField.fieldType == "GENERICIPADDRESSFIELD") {
+        return "v-text-field";
+      } else if (additionalField.fieldType == "BOOLEANFIELD" || additionalField.fieldType == "NULLBOOLEANFIELD") {
+        // TODO: implement proper null boolean input
+        return "v-checkbox"
+      } else if (additionalField.fieldType == "DATEFIELD") {
+        return DateField;
+      } else if (additionalField.fieldType == "DATETIMEFIELD") {
+        return DateTimeField;
+      } else if (additionalField.fieldType == "TIMEFIELD") {
+        return TimeField;
+      } else if (additionalField.fieldType == "INTEGERFIELD" || additionalField.fieldType == "DECIMALFIELD") {
+        // TODO: implement proper decimal input
+        return PositiveSmallIntegerField;
+      }
+      return "";
+    },
+  },
+};
+
+export default eventAdditionalFieldMixin;
+  
\ No newline at end of file

aleksis/apps/paweljong/frontend/components/event_registration/eventRegistrationMutation.graphql

+mutation sendOrder(
+  $event: ID!
+  $eventRegistration: EventRegistrationInputType!
+) {
+  sendEventRegistration(event: $event, eventRegistration: $eventRegistration) {
+    ok
+  }
+}

aleksis/apps/paweljong/frontend/components/event_registration/helpers.graphql

+query whoAmI {
+  whoAmI {
+    id
+    username
+    person {
+      id
+      firstName
+      lastName
+      guardians {
+        id
+        firstName
+        lastName
+        mobileNumber
+        email
+      }
+      email
+    }
+  }
+}

aleksis/apps/paweljong/frontend/index.js

@@ -30,11 +30,9 @@ export default {
     },
     {
       path: "event/:slug/register/",
-      component: () => import("aleksis.core/components/LegacyBaseTemplate.vue"),
+      component: () => import("./components/event_registration/EventRegistrationForm.vue"),
       name: "paweljong.registerEventBySlug",
-      props: {
-        byTheGreatnessOfTheAlmightyAleksolotlISwearIAmWorthyOfUsingTheLegacyBaseTemplate: true,
-      },
+      props: true,
     },
     {
       path: "group_persons/:pk/add/",

aleksis/apps/paweljong/frontend/messages/en.json

@@ -51,6 +51,202 @@
         "optional": "Optional"
       },
       "help_text": "Helptext"
+    },
+    "event_registration": {
+      "form": {
+        "submitted": {
+          "thank_you": "Thanks!",
+          "submitted_successfully": "Your registration was submitted successfully."
+        },
+        "steps": {
+          "email": {
+            "title": "E-Mail address",
+            "choose_mode": {
+              "help_text": "To continue, you'll need to provide an e-mail address. You can choose between registering an e-mail address with AlekSIS and using your own, existing e-mail address.",
+              "continue_aleksis": "Continue using new AlekSIS e-mail address",
+              "continue_own": "Continue using own e-mail address"
+            },
+            "help_texts": {
+              "participant": "",
+              "guardian": ""
+            },
+            "fields": {
+              "email": {
+                "label": "E-Mail address"
+              },
+              "confirm_email": {
+                "label": "Confirm e-mail address"
+              }
+            }
+          },
+          "register": {
+            "title": "Account",
+            "help_texts": {
+              "participant": "",
+              "guardian": ""
+            },
+            "fields": {
+              "first_name": {
+                "label": "First name"
+              },
+              "last_name": {
+                "label": "Last name"
+              },
+              "username": {
+                "label": "Username"
+              },
+              "password": {
+                "label": "Password"
+              },
+              "confirm_password": {
+                "label": "Confirm password"
+              }
+            }
+          },
+          "contact_details": {
+            "title": "Contact information",
+            "help_texts": {
+              "participant": "",
+              "guardian": ""
+            },
+            "fields": {
+              "first_name": {
+                "label": "First name"
+              },
+              "last_name": {
+                "label": "Last name"
+              },
+              "date_of_birth": {
+                "label": "Date of birth"
+              },
+              "sex": {
+                "label": "Sex",
+                "help_text": "For various reasons, e.g. because we have to keep gender segregation during the night for legal reasons, we need to know if you are a boy or a girl."
+              },
+              "street": {
+                "label": "Street"
+              },
+              "housenumber": {
+                "label": "Housenumber"
+              },
+              "postal_code": {
+                "label": "Postal code"
+              },
+              "place": {
+                "label": "Place"
+              },
+              "email": {
+                "label": "E-Mail address",
+                "help_text": "Please use your personal e-mail address here, which you will check personally. Important information will always be sent to your parents as well. Do not use an e-mail address owned by your parents here."
+              },
+              "mobile_number": {
+                "label": "Mobile number",
+                "help_text": "Your mobile number helps us to reach you in an emergency during the event, e.g. if you are alone with your group at a conference or similar. If you don't have a cell phone, you can leave the field blank."
+              },
+              "school": {
+                "label": "School",
+                "help_text": "Please enter the name of your school."
+              },
+              "school_place": {
+                "label": "School place",
+                "help_text": "Enter the place (city) where your school is located."
+              },
+              "school_class": {
+                "label": "School class",
+                "help_text": "Please enter the class you are in (e.g. 8a)."
+              }
+            }
+          },
+          "guardians": {
+            "title": "Legal guardians",
+            "counter": "Guardian {i}",
+            "add": "Add guardian",
+            "help_texts": {
+              "participant": "",
+              "guardian": ""
+            },
+            "fields": {
+              "first_name": {
+                "label": "Guardian's first name",
+                "help_text": "Please enter the first name of the legal guardian who will fill in the registration with you and who can be reached during the event in an emergency."
+              },
+              "last_name": {
+                "label": "Guardian's last name",
+                "help_text": "Please enter the last name of the legal guardian who will fill in the registration with you and who can be reached during the event in an emergency."
+              },
+              "email": {
+                "label": "Guardian's email address"
+              },
+              "mobile_number": {
+                "label": "Guardian's mobile number",
+                "help_text": "We need the mobile phone number for emergencies if we urgently need to reach your parents during the event."
+              }
+            }
+          },
+          "additional": {
+            "title": "Additional information",
+            "help_texts": {
+              "participant": "",
+              "guardian": ""
+            },
+            "fields": {
+              "medical_information": {
+                "label": "Medical information / intolerances",
+                "help_text": "If there are any medically important things we need to consider, e.g. when making food or to make sure you take prescribed medication, please enter it here."
+              }
+            }
+          },
+          "financial": {
+            "title": "Payment",
+            "help_texts": {
+              "participant": "",
+              "guardian": ""
+            },
+            "fields": {
+              "": {
+                "": ""
+              }
+            }
+          },
+          "consent": {
+            "title": "Consent",
+            "help_texts": {
+              "participant": "",
+              "guardian": ""
+            },
+            "fields": {
+              "retraction_consent": {
+                "label": "I confirm that the retraction of the registration is not possible anymore after {date}"
+              }
+            }
+          },
+          "confirm": {
+            "title": "Confirm",
+            "hint": "After this step, you won't be able to edit your registration.",
+            "help_texts": {
+              "participant": "",
+              "guardian": ""
+            },
+            "fields": {
+              "comment": {
+                "label": "Other remarks",
+                "help_text": "You can write down any remarks you want to tell us here."
+              }
+            }
+          }
+        },
+        "rules": {
+          "email": {
+            "valid": "This is not a valid e-mail address"
+          },
+          "confirm_email": {
+            "no_match": "The e-mail addresses do not match"
+          },
+          "confirm_password": {
+            "no_match": "The passwords do not match"
+          }
+        }
+      }
     }
   }
 }

aleksis/apps/paweljong/schema/__init__.py

+from django.core.exceptions import PermissionDenied
+
+import graphene
+from graphene_django import DjangoObjectType
+from graphql import GraphQLError
+
+from aleksis.core.schema.base import FilterOrderList
+
+from .checkpoint import CheckpointCheckInMutation
+from .event import EventType
+from .event_additional_field import (
+    EventAdditionalFieldBatchCreateMutation,
+    EventAdditionalFieldBatchDeleteMutation,
+    EventAdditionalFieldBatchPatchMutation,
+    EventAdditionalFieldType
+)
+from .terms import TermsType
+from ..models import Event
+
+
+class Query(graphene.ObjectType):
+    event_additional_fields = FilterOrderList(EventAdditionalFieldType)
+
+    event_by_id = graphene.Field(EventType, id=graphene.ID())
+    event_by_slug = graphene.Field(EventType, slug=graphene.String())
+
+    terms = FilterOrderList(TermsType)
+
+    @staticmethod
+    def resolve_event_by_id(root, info, id):
+        event = Event.objects.get(pk=id)
+        # if not info.context.user.has_perm("paweljong.view_person_rule", event):
+        #     return None
+        return event
+
+    @staticmethod
+    def resolve_event_by_slug(root, info, slug):
+        event = Event.objects.get(slug=slug)
+        # if not info.context.user.has_perm("paweljong.view_person_rule", event):
+        #     return None
+        return event
+
+
+class Mutation(graphene.ObjectType):
+    checkpoint_check_in = CheckpointCheckInMutation.Field()
+
+    create_event_additional_fields = EventAdditionalFieldBatchCreateMutation.Field()
+    delete_event_additional_fields = EventAdditionalFieldBatchDeleteMutation.Field()
+    update_event_additional_fields = EventAdditionalFieldBatchPatchMutation.Field()

aleksis/apps/paweljong/schema.py → aleksis/apps/paweljong/schema/checkpoint.py

@@ -3,24 +3,12 @@ from django.utils import timezone
 
 import graphene
 from graphene_django import DjangoObjectType
-from graphql import GraphQLError
 
-from aleksis.core.models import Person
-from aleksis.core.schema.base import (
-    BaseBatchCreateMutation,
-    BaseBatchDeleteMutation,
-    BaseBatchPatchMutation,
-    FilterOrderList,
-    PermissionsTypeMixin,
-)
+from aleksis.core.schema.base import PermissionsTypeMixin
 from aleksis.core.util.core_helpers import has_person
+from aleksis.core.models import Person
 
-from .models import Checkpoint, Event, EventAdditionalField
-
-
-class EventType(PermissionsTypeMixin, DjangoObjectType):
-    class Meta:
-        model = Event
+from ..models import Checkpoint, Event
 
 
 class CheckpointType(PermissionsTypeMixin, DjangoObjectType):
@@ -28,11 +16,6 @@ class CheckpointType(PermissionsTypeMixin, DjangoObjectType):
         model = Checkpoint
 
 
-class EventAdditionalFieldType(PermissionsTypeMixin, DjangoObjectType):
-    class Meta:
-        model = EventAdditionalField
-
-
 class CheckpointCheckInMutation(graphene.Mutation):
     class Arguments:
         event_slug = graphene.String(required=True)
@@ -84,46 +67,3 @@ class CheckpointCheckInMutation(graphene.Mutation):
         checkpoint.save()
 
         return CheckpointCheckInMutation(checkpoint=checkpoint)
-
-
-class EventAdditionalFieldBatchCreateMutation(BaseBatchCreateMutation):
-    class Meta:
-        model = EventAdditionalField
-        permissions = ("paweljong.create_event_additional_field_rule",)
-        only_fields = (
-            "title",
-            "field_type",
-            "required",
-            "help_text",
-        )
-
-
-class EventAdditionalFieldBatchDeleteMutation(BaseBatchDeleteMutation):
-    class Meta:
-        model = EventAdditionalField
-        permissions = ("paweljong.delete_event_additional_field_rule",)
-
-
-class EventAdditionalFieldBatchPatchMutation(BaseBatchPatchMutation):
-    class Meta:
-        model = EventAdditionalField
-        permissions = ("paweljong.edit_event_additional_field_rule",)
-        only_fields = (
-            "id",
-            "title",
-            "field_type",
-            "required",
-            "help_text",
-        )
-
-
-class Query(graphene.ObjectType):
-    event_additional_fields = FilterOrderList(EventAdditionalFieldType)
-
-
-class Mutation(graphene.ObjectType):
-    checkpoint_check_in = CheckpointCheckInMutation.Field()
-
-    create_event_additional_fields = EventAdditionalFieldBatchCreateMutation.Field()
-    delete_event_additional_fields = EventAdditionalFieldBatchDeleteMutation.Field()
-    update_event_additional_fields = EventAdditionalFieldBatchPatchMutation.Field()

aleksis/apps/paweljong/schema/event.py

+from graphene_django import DjangoObjectType
+
+from aleksis.core.schema.base import PermissionsTypeMixin
+
+from ..models import Event
+
+
+class EventType(PermissionsTypeMixin, DjangoObjectType):
+    class Meta:
+        model = Event

aleksis/apps/paweljong/schema/event_additional_field.py

+from graphene_django import DjangoObjectType
+
+from aleksis.core.schema.base import (
+    BaseBatchCreateMutation,
+    BaseBatchDeleteMutation,
+    BaseBatchPatchMutation,
+    PermissionsTypeMixin,
+)
+
+from ..models import EventAdditionalField
+
+
+class EventAdditionalFieldType(PermissionsTypeMixin, DjangoObjectType):
+    class Meta:
+        model = EventAdditionalField
+
+
+class EventAdditionalFieldBatchCreateMutation(BaseBatchCreateMutation):
+    class Meta:
+        model = EventAdditionalField
+        permissions = ("paweljong.create_event_additional_field_rule",)
+        only_fields = (
+            "title",
+            "field_type",
+            "required",
+            "help_text",
+        )
+
+
+class EventAdditionalFieldBatchDeleteMutation(BaseBatchDeleteMutation):
+    class Meta:
+        model = EventAdditionalField
+        permissions = ("paweljong.delete_event_additional_field_rule",)
+
+
+class EventAdditionalFieldBatchPatchMutation(BaseBatchPatchMutation):
+    class Meta:
+        model = EventAdditionalField
+        permissions = ("paweljong.edit_event_additional_field_rule",)
+        only_fields = (
+            "id",
+            "title",
+            "field_type",
+            "required",
+            "help_text",
+        )

aleksis/apps/paweljong/schema/event_registration.py

+import graphene
+from graphene_django import DjangoObjectType
+
+from aleksis.core.schema.base import PermissionsTypeMixin
+
+from ..models import EventRegistration
+
+
+class EventRegistrationType(PermissionsTypeMixin, DjangoObjectType):
+    class Meta:
+        model = EventRegistration
+
+
+class EventRegistrationInputType(graphene.InputObjectType):
+    full_name = graphene.String(required=True)
+    email = graphene.String(required=True)
+    notes = graphene.String(required=False)
+    shipping_option = graphene.ID(required=True)
+    payment_option = graphene.ID(required=True)
+    items = graphene.List(OrderItemInputType, required=True)
+    shipping_full_name = graphene.String(required=False)
+    second_address_row = graphene.String(required=False)
+    street = graphene.String(required=False)
+    housenumber = graphene.String(required=False)
+    plz = graphene.String(required=False)
+    place = graphene.String(required=False)

aleksis/apps/paweljong/schema/terms.py

+from graphene_django import DjangoObjectType
+
+from aleksis.core.schema.base import PermissionsTypeMixin
+
+from ..models import Terms
+
+
+class TermsType(PermissionsTypeMixin, DjangoObjectType):
+    class Meta:
+        model = Terms