Feature/zms 1228 name of child textfield (#21)

* Add Child Name Textfield to Contact Form * Add customtextfield to contact form * Remove log file --------- Co-authored-by: Thomas Fink <[email protected]>
it-at-m · Oct 18, 2023 · 2d82e88 · 2d82e88
1 parent e9421a3
commit 2d82e88
Show file tree

Hide file tree

Showing 13 changed files with 95 additions and 28 deletions.
diff --git a/frontend/__tests__/components/CustomerInfo.spec.js b/frontend/__tests__/components/CustomerInfo.spec.js
@@ -28,14 +28,18 @@ const wrapper = mount(CustomerInfo, {
         }
     }),
     propsData: {
-        telephoneRequired: false, // or whatever the desired value is
-        telephoneActivated: false, // or whatever the desired value is
+        telephoneRequired: false,
+        telephoneActivated: false,
+        customTextfieldRequired: false,
+        customTextfieldActivated: false,
     }
 })
 
 describe('Customer info', () => {
     const nameInput = wrapper.find('#customer-name')
     const emailInput = wrapper.find('#customer-email')
+    const telephoneInput = wrapper.find('#customer-telephone')
+    const customTextfieldInput = wrapper.find('#customer-custom-textfield')
     const dataProtectionCheckbox = wrapper.find('#customer-data-protection')
     const submitButton = wrapper.find('#customer-submit-button') 
 
@@ -99,6 +103,8 @@ describe('Customer info', () => {
         submitButton.trigger('click')
         await wrapper.vm.$nextTick()
 
+        console.log(store.state.data.appointment);
+
         expect(wrapper.emitted().next).toBeDefined()
         expect(dispatch).toHaveBeenCalledTimes(1)
         /*expect(dispatch.mock.calls[0]).toStrictEqual([

diff --git a/frontend/__tests__/store/actions.spec.js b/frontend/__tests__/store/actions.spec.js
@@ -223,6 +223,7 @@ describe('Actions', () => {
             name: 'Max',
             email: '[email protected]',
             telephone: '+1234567890',
+            customTextfield: 'Smith',
             dataProtection: true
         }
 
@@ -240,6 +241,7 @@ describe('Actions', () => {
             familyName: 'Max',
             email: '[email protected]',
             telephone: '+1234567890',
+            customTextfield: 'Smith',
             timestamp: 1589373217,
             processId: 111,
             authKey: 'abc'

diff --git a/frontend/__tests__/store/modules/api/actions.spec.js b/frontend/__tests__/store/modules/api/actions.spec.js
@@ -107,7 +107,8 @@ describe('API actions', () => {
             authKey: 'bbb',
             familyName: 'Musterman',
             email: '[email protected]',
-            telephone: ''
+            telephone: '',
+            customTextfield: ''
         })
 
         expect(fetch.mock.calls.length).toEqual(1);
@@ -117,7 +118,8 @@ describe('API actions', () => {
             "authKey": 'bbb',
             "familyName": 'Musterman',
             "email": '[email protected]',
-            "telephone": ''
+            "telephone": '',
+            "customTextfield": ''
         }))
     })
 

diff --git a/frontend/__tests__/store/modules/formData/mutations.spec.js b/frontend/__tests__/store/modules/formData/mutations.spec.js
@@ -266,13 +266,15 @@ describe('Form data mutations', () => {
             name: 'Max',
             email: '[email protected]',
             telephone: "123456789",
+            customTextfield: "Smith",
             dataProtection: true
         })
 
         expect(state.customer).toStrictEqual({
             name: 'Max',
             email: '[email protected]',
             telephone: "123456789",
+            customTextfield: "Smith",
             dataProtection: true
         })
     })

diff --git a/frontend/public/mocks/confirm.json b/frontend/public/mocks/confirm.json
@@ -8,7 +8,7 @@
   },
   "data": {
     "$schema": "https://schema.berlin.de/queuemanagement/process.json",
-    "amendment": "",
+    "customTextfield": "",
     "appointments": [
       {
         "date": 1648708200,
@@ -66,7 +66,8 @@
         "email": "",
         "emailSendCount": "0",
         "notificationsSendCount": "0",
-        "telephone": ""
+        "telephone": "",
+        "customTextfield": ""
       }
     ],
     "createIP": "",
@@ -280,12 +281,13 @@
         },
         "client": {
           "alternateAppointmentUrl": "",
-          "amendmentActivated": "0",
-          "amendmentLabel": "",
+          "customTextfieldLabel": "",
           "emailFrom": "",
           "emailRequired": 0,
           "telephoneActivated": "0",
-          "telephoneRequired": 0
+          "telephoneRequired": 0,
+          "customTextfieldActivated": "0",
+          "customTextfieldRequired": 0
         },
         "notifications": {
           "confirmationContent": "",
@@ -315,7 +317,7 @@
           "buttonName": "Termin Wartebereich BB Pasing",
           "confirmationEnabled": "0",
           "deactivatedText": "",
-          "notificationsAmendmentEnabled": "0",
+          "notificationscustomTextfieldEnabled": "0",
           "notificationsEnabled": "0",
           "notificationsDelay": "0"
         },

diff --git a/frontend/public/mocks/reserve.json b/frontend/public/mocks/reserve.json
@@ -8,7 +8,7 @@
   },
   "data": {
     "$schema": "https://schema.berlin.de/queuemanagement/process.json",
-    "amendment": "",
+    "customTextfield": "",
     "appointments": [
       {
         "date": 1648102200,
@@ -62,7 +62,8 @@
         "email": "",
         "emailSendCount": "0",
         "notificationsSendCount": "0",
-        "telephone": ""
+        "telephone": "",
+        "customTextfield": ""
       }
     ],
     "createIP": "",

diff --git a/frontend/public/mocks/saveAppointmentData.json b/frontend/public/mocks/saveAppointmentData.json
@@ -8,7 +8,7 @@
   },
   "data": {
     "$schema": "https://schema.berlin.de/queuemanagement/process.json",
-    "amendment": "",
+    "customTextfield": "",
     "appointments": [
       {
         "date": 0,
@@ -35,7 +35,8 @@
         "email": "[email protected]",
         "emailSendCount": "0",
         "notificationsSendCount": "0",
-        "telephone": ""
+        "telephone": "",
+        "customTextfield": ""
       }
     ],
     "createIP": "",
@@ -71,7 +72,8 @@
       "preferences": {
         "client": {
           "emailRequired": 0,
-          "telephoneRequired": 0
+          "telephoneRequired": 0,
+          "customTextfieldRequired": 0
         },
         "workstation": {
           "emergencyRefreshInterval": "5"

diff --git a/frontend/src/components/CustomerInfo.vue b/frontend/src/components/CustomerInfo.vue
@@ -16,6 +16,11 @@
         @blur="$v.telephone.$touch()" @change="changed" :label="(isTelephoneRequired) ? $t('telephoneRequired') : $t('telephone')"
         :disabled="isPreselectedAppointment"></v-text-field>
     </div>
+    <div id="customer-custom-textfield-section" v-if="isCustomTextfieldActivated">
+      <v-text-field v-model="customer.customTextfield" id="customer-custom-textfield" counter="20" :maxlength="20"  filled :error-messages="customTextfieldErrors"
+        @blur="$v.customTextfield.$touch()" @change="changed" :label="(isCustomTextfieldRequired ? 'Nachname des Kindes' + '*' : 'Nachname des Kindes')"
+        :disabled="isPreselectedAppointment"></v-text-field>
+    </div>
 
     <v-checkbox id="customer-data-protection" v-model="customer.dataProtection" label=""
       :error-messages="dataProtectionErrors" required @input="$v.dataProtection.$touch()"
@@ -58,6 +63,10 @@ export default {
         maxLength: maxLength(20),
         validFormat: this.validTelephoneFormat
       },
+      customTextfield: {
+        required: this.isCustomTextfieldRequired ? required : () => true,
+        maxLength: maxLength(50)
+      },
       dataProtection: {
         required
       }
@@ -93,6 +102,14 @@ export default {
         return this.customer.telephone = newValue
       }
     },
+    customTextfield: {
+      get() {
+        return this.customer.customTextfield
+      },
+      set(newValue) {
+        return this.customer.customTextfield = newValue
+      }
+    },
     dataProtection: {
       get() {
         return this.customer.dataProtection
@@ -101,6 +118,21 @@ export default {
         return this.customer.dataProtection = newValue
       }
     },
+    isCustomTextfieldActivated() {
+        return this.$store.state.data.appointment &&
+               this.$store.state.data.appointment.scope &&
+               this.$store.state.data.appointment.scope.customTextfieldActivated == 1;
+    },
+    isCustomTextfieldRequired() {
+        return this.$store.state.data.appointment &&
+               this.$store.state.data.appointment.scope &&
+               this.$store.state.data.appointment.scope.customTextfieldRequired == 1;
+    }, 
+    customTextfieldLabel() {
+        return this.$store.state.data.appointment &&
+               this.$store.state.data.appointment.scope &&
+               this.$store.state.data.appointment.scope.customTextfieldLabel;
+    },        
     isTelephoneActivated() {
         return this.$store.state.data.appointment &&
                this.$store.state.data.appointment.scope &&
@@ -129,14 +161,18 @@ export default {
       return errors;
     },
     telephoneErrors() {
-
       const errors = [];
       if (!this.$v.telephone.$dirty) return errors;
       !this.$v.telephone.required && errors.push(this.$t('telephoneIsRequired'));
       !this.$v.telephone.maxLength && errors.push(this.$t('textLengthExceeded'));
       !this.$v.telephone.validFormat && errors.push(this.$t('mustBeValidTelephone'));
-
-
+      return errors;
+    },
+    customTextfieldErrors() {
+      const errors = [];
+      if (!this.$v.customTextfield.$dirty) return errors;
+      !this.$v.customTextfield.required && errors.push(this.$t('customTextfieldIsRequired'));
+      !this.$v.customTextfield.maxLength && errors.push(this.$t('textLengthExceeded'));
       return errors;
     },
 
@@ -159,7 +195,7 @@ export default {
     saveCustomer() {
       this.$v.$touch()
 
-      if (this.emailErrors.length || this.nameErrors.length || this.dataProtectionErrors.length || this.telephoneErrors.length) {
+      if (this.emailErrors.length || this.nameErrors.length || this.dataProtectionErrors.length || this.telephoneErrors.length || this.customTextfieldErrors.length) {
         return
       }
       this.$store.dispatch('updateAppointmentData', {

diff --git a/frontend/src/store/actions.js b/frontend/src/store/actions.js
@@ -5,6 +5,7 @@ export default {
         appointment.familyName = appointment.client.name
         appointment.email = appointment.client.email
         appointment.telephone = appointment.client.telephone
+        appointment.customTextfield = appointment.client.customTextfield
 
         store.dispatch('API/updateAppointmentData', appointment)
             .then((data) => {
@@ -114,6 +115,7 @@ export default {
             name: appointmentData.familyName,
             email: appointmentData.email,
             telephone: appointmentData.telephone,
+            customTextfield: appointmentData.customTextfield,
             dataProtection: true
         }
 

diff --git a/frontend/src/store/modules/api/actions.js b/frontend/src/store/modules/api/actions.js
@@ -191,6 +191,7 @@ export default {
                     "familyName": appointment.familyName,
                     "email": appointment.email,
                     "telephone": appointment.telephone,
+                    "customTextfield": appointment.customTextfield
                 })
             };
 

diff --git a/frontend/src/store/modules/formData/mutations.js b/frontend/src/store/modules/formData/mutations.js
@@ -72,6 +72,7 @@ export default {
         state.customer.name = customer ? customer.name : null
         state.customer.email = customer ? customer.email : null
         state.customer.telephone = customer ? customer.telephone : null
+        state.customer.customTextfield = customer ? customer.customTextfield : null
         state.customer.dataProtection = customer ? customer.dataProtection : null
     }
 }
diff --git a/frontend/src/translations/de/index.js b/frontend/src/translations/de/index.js
@@ -31,24 +31,27 @@ export default {
   typeContactData: "Kontaktdaten eingeben",
   pleaseCheckOnceAgain: "Bitte überprüfen Sie noch einmal Ihre Daten und schließen Sie die Reservierung ab.",
   name: "Name*",
+  nameIsRequired:'Bitte geben Sie einen gültigen Namen ein.',
   email: "E-Mail-Adresse*",
+  emailIsRequired: 'Bitte geben Sie eine gültige E-Mail-Adresse ein.',
+  mustBeValidEmail: 'Muss eine gültige E-Mail-Adresse sein.',
   telephone: "Telefon",
   telephoneRequired: "Telefon*",
   telephoneIsRequired: 'Bitte geben Sie eine gültige Telefonnummer ein.',
+  mustBeValidTelephone: 'Bitte geben Sie eine gültige Telefonnummer ein.',
   countryCode: "Landesvorwahl",
   countryCodeRequired: "Landesvorwahl*",
+  customTextfield: "Nachname des Kindes*",
+  customTextfieldIsRequired: 'Bitte geben Sie einen gültigen Namen ein.',
+  mustBeValidcustomTextfield: 'Bitte geben Sie einen gültigen Namen ein.',
   location: "Standort",
   yourAppointmentNumber: "Ihre Terminnummer",
   wantToCancelAppointment: "Wollen Sie diesen Termin absagen?",
   wantToStartOverAppointment: "Wollen Sie die Terminbuchung wirklich abbrechen?",
   currentAppointmentWillBeCanceled: "Der jetzige Termin wird nicht gebucht!",
   wantToRebookAppointment: "Wollen Sie diesen Termin umbuchen?",
   privacyPolicyAccepted: "<a href=\"https://stadt.muenchen.de/infos/dsgvo-datenschutzgrundverordnung.html\" target='_blank'>Datenschutzhinweise</a> zur Kenntnis genommen*",
-  nameIsRequired:'Bitte geben Sie einen gültigen Namen ein.',
-  emailIsRequired: 'Bitte geben Sie eine gültige E-Mail-Adresse ein.',
   acceptPrivacyPolicy: 'Das Akzeptieren der Datenschutzrichtlinie ist erforderlich.',
-  mustBeValidEmail: 'Muss eine gültige E-Mail-Adresse sein.',
-  mustBeValidTelephone: 'Bitte geben Sie eine gültige Telefonnummer ein.',
   languages: {
     de: 'Deutsch',
     en: 'Englisch',

diff --git a/frontend/src/translations/en/index.js b/frontend/src/translations/en/index.js
@@ -23,19 +23,26 @@ export default {
   contactData: "Contact data",
   pleaseCheckOnceAgain: "Please check your data once again and reserve appointment",
   name: "Name",
+  nameIsRequired: 'Please enter a valid name.',
   email: "E-mail",
+  emailIsRequired: 'Please enter a valid e-mail.',
+  mustBeValidEmail: 'Must be a valid e-mail.',
+  telephone: "Telephone",
+  telephoneRequired: "Telephone*",
+  telephoneIsRequired: 'Please enter a valid phone number.',
+  mustBeValidTelephone: 'Please enter a valid phone number.',
+  countryCode: "Country Code",
+  countryCodeRequired: "Country Code*",
+  customTextfield: "Last Name of the Child*",
+  customTextfieldIsRequired: 'Please enter a valid name.',
+  mustBeValidcustomTextfield: 'Please enter a valid name.',
   location: "Location",
   isRequired: 'is required',
   yourAppointmentNumber: "Your appointment number",
   wantToCancelAppointment: "Do you want to cancel this appointment?",
   wantToRebookAppointment: "Do you want to reschedule this appointment?",
   privacyPolicyAccepted: "<a href=\"https://stadt.muenchen.de/infos/dsgvo-datenschutzgrundverordnung.html\" target='_blank'>Privacy policy</a> accepted*",
   acceptPrivacyPolicy: 'Accepting the privacy policy is required',
-  telephoneIsRequired: 'Please enter a valid phone number.',
-  countryCode: "Country Code",
-  countryCodeRequired: "Country Code*",
-  mustBeValidEmail: 'Must be a valid e-mail.',
-  mustBeValidTelephone: 'Please enter a valid phone number.',
   languages: {
     de: 'German',
     en: 'English',