From 2d82e88f7e474b827abfdb456fbad848bac125ac Mon Sep 17 00:00:00 2001 From: Thomas Fink <53316058+ThomasAFink@users.noreply.github.com> Date: Wed, 18 Oct 2023 17:35:56 +0200 Subject: [PATCH] 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 --- .../__tests__/components/CustomerInfo.spec.js | 10 ++++- frontend/__tests__/store/actions.spec.js | 2 + .../store/modules/api/actions.spec.js | 6 ++- .../store/modules/formData/mutations.spec.js | 2 + frontend/public/mocks/confirm.json | 14 +++--- frontend/public/mocks/reserve.json | 5 ++- .../public/mocks/saveAppointmentData.json | 8 ++-- frontend/src/components/CustomerInfo.vue | 44 +++++++++++++++++-- frontend/src/store/actions.js | 2 + frontend/src/store/modules/api/actions.js | 1 + .../src/store/modules/formData/mutations.js | 1 + frontend/src/translations/de/index.js | 11 +++-- frontend/src/translations/en/index.js | 17 ++++--- 13 files changed, 95 insertions(+), 28 deletions(-) diff --git a/frontend/__tests__/components/CustomerInfo.spec.js b/frontend/__tests__/components/CustomerInfo.spec.js index 9fb8b95..0b0924b 100644 --- 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 index 470beed..d3e1f5c 100644 --- a/frontend/__tests__/store/actions.spec.js +++ b/frontend/__tests__/store/actions.spec.js @@ -223,6 +223,7 @@ describe('Actions', () => { name: 'Max', email: 'max@gmail.com', telephone: '+1234567890', + customTextfield: 'Smith', dataProtection: true } @@ -240,6 +241,7 @@ describe('Actions', () => { familyName: 'Max', email: 'max@gmail.com', 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 index faad37a..d4ea893 100644 --- 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: 'test@gmail.com', - telephone: '' + telephone: '', + customTextfield: '' }) expect(fetch.mock.calls.length).toEqual(1); @@ -117,7 +118,8 @@ describe('API actions', () => { "authKey": 'bbb', "familyName": 'Musterman', "email": 'test@gmail.com', - "telephone": '' + "telephone": '', + "customTextfield": '' })) }) diff --git a/frontend/__tests__/store/modules/formData/mutations.spec.js b/frontend/__tests__/store/modules/formData/mutations.spec.js index d274b3a..e28d3b2 100644 --- a/frontend/__tests__/store/modules/formData/mutations.spec.js +++ b/frontend/__tests__/store/modules/formData/mutations.spec.js @@ -266,6 +266,7 @@ describe('Form data mutations', () => { name: 'Max', email: 'max@gmail.com', telephone: "123456789", + customTextfield: "Smith", dataProtection: true }) @@ -273,6 +274,7 @@ describe('Form data mutations', () => { name: 'Max', email: 'max@gmail.com', telephone: "123456789", + customTextfield: "Smith", dataProtection: true }) }) diff --git a/frontend/public/mocks/confirm.json b/frontend/public/mocks/confirm.json index fda2c90..ef988d9 100644 --- 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 index d48e781..9b0cd35 100644 --- 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 index 08f748c..27f2621 100644 --- 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": "ext.dl.manjencic@muenchen.de", "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 index a36a40d..1da6e58 100644 --- 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"> +
+ +
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 index 0942543..f60f82a 100644 --- 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 index 3a2faf2..7815dfa 100644 --- 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 index 7a16914..9c793f6 100644 --- 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 } } \ No newline at end of file diff --git a/frontend/src/translations/de/index.js b/frontend/src/translations/de/index.js index aaae035..9602174 100644 --- a/frontend/src/translations/de/index.js +++ b/frontend/src/translations/de/index.js @@ -31,12 +31,19 @@ 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?", @@ -44,11 +51,7 @@ export default { currentAppointmentWillBeCanceled: "Der jetzige Termin wird nicht gebucht!", wantToRebookAppointment: "Wollen Sie diesen Termin umbuchen?", privacyPolicyAccepted: "Datenschutzhinweise 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 index db24caf..3137150 100644 --- a/frontend/src/translations/en/index.js +++ b/frontend/src/translations/en/index.js @@ -23,7 +23,19 @@ 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", @@ -31,11 +43,6 @@ export default { wantToRebookAppointment: "Do you want to reschedule this appointment?", privacyPolicyAccepted: "Privacy policy 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',