From d37d440ba72d7f0adcc2ceb2cbb41e263f63ccf8 Mon Sep 17 00:00:00 2001 From: Tobias de Bruijn Date: Sat, 14 Sep 2024 13:18:08 +0200 Subject: [PATCH] Implement Marian's feedback --- frontend/src/plugins/locales/en.ts | 6 +- frontend/src/plugins/locales/nl.ts | 8 +-- frontend/src/views/HomeView.vue | 90 +++++++++++++++++------------- 3 files changed, 57 insertions(+), 47 deletions(-) diff --git a/frontend/src/plugins/locales/en.ts b/frontend/src/plugins/locales/en.ts index 88e7c14..ebed216 100644 --- a/frontend/src/plugins/locales/en.ts +++ b/frontend/src/plugins/locales/en.ts @@ -1,12 +1,12 @@ import {Locale} from "@/plugins/locales/locale"; const EN: Locale = { - site_title: "Anonymous reporting point", + site_title: "Reporting point for intolerant behaviour", error: "Something went wrong, please try again later", home: { welcome: { - title: "Welcome to the anonymous reporting point of Sticky", - subtitle: "You can make fully anonymous reports here about unnapropriate behaviour or sexual misconduct. You can send this report to (one of the) confidential advisors or to the board, that is completely up to you. Furthermore, you can choose if you want us to contact you if you would like to hear back from us, of course, this is not required", + title: "Welcome to the reporting point for intolerant behaviour for Sticky", + subtitle: "You can make fully anonymous reports here about of unwanted, transgressive, threatening, humiliating or intimidating behavior. You can send this report to (one of the) confidential advisors or to the board, that is completely up to you. Furthermore, you can choose if you want us to contact you if you would like to hear back from us, of course, this is not required", }, form: { title: "Describe your report", diff --git a/frontend/src/plugins/locales/nl.ts b/frontend/src/plugins/locales/nl.ts index 8cb6415..f8b7ae6 100644 --- a/frontend/src/plugins/locales/nl.ts +++ b/frontend/src/plugins/locales/nl.ts @@ -1,12 +1,12 @@ import {Locale} from "@/plugins/locales/locale"; const NL: Locale = { - site_title: "Anoniem meldpunt", + site_title: "Meldpunt voor intolerant gedrag", error: "Er is iets verkeerd gegaan, probeer het later opnieuw", home: { welcome: { - title: "Welkom bij het anonieme meldpunt van Sticky", - subtitle: "Je kunt hier volledig annoniem een melding maken van ongewenst gedrag en seksueel wangedrag. Je kunt deze melding versturen aan het bestuur of (een van de) vertrouwenscontactpersonen, dat is aan jou. Ook kun je er voor kiezen dat er contact met je mag worden opgenomen als je graag terugkoppeling wilt, uiteraard is dit niet verplicht." + title: "Welkom bij het meldpunt voor intolerant gedrag van Sticky", + subtitle: "Je kunt hier volledig anoniem een melding maken van ongewenst, grensoverschrijdend, bedreigend, vernederend of intimiderend gedrag. Je kunt deze melding versturen aan het bestuur of aan (een van) de vertrouwenscontactpersonen, dat is aan jou. Ook kun je er voor kiezen dat er contact met je mag worden opgenomen als je graag terugkoppeling wilt, uiteraard is dit niet verplicht." }, form: { title: "Omschrijving van je melding", @@ -16,7 +16,7 @@ const NL: Locale = { invalidEmail: "Het opgegeven email adres is ongeldig", required: "Vereist", submit: "Melding versturen", - toReceivers: "Aan wie wil je dat jouw bericht wordt verstuurd?", + toReceivers: "Aan wie wil je dat jouw melding wordt verstuurd?", selectReceivers: "Selecteer..", allowContact: "Wil je dat we contact met je opnemen naar aanleiding van je melding?", contactEmail: "Email adres", diff --git a/frontend/src/views/HomeView.vue b/frontend/src/views/HomeView.vue index 4a7a69d..f5af05d 100644 --- a/frontend/src/views/HomeView.vue +++ b/frontend/src/views/HomeView.vue @@ -28,7 +28,43 @@

{{ $t('home.form.subtitle') }}

- + + + +

+ {{ $t('home.form.allowContact') }} +

+
+ + + +
+ + + +

+ {{ $t('home.form.contactEmailExplanation') }}: +

+
+ + + +
+ - - - -

- {{ $t('home.form.allowContact') }} -

-
- - - -
- - - -

- {{ $t('home.form.contactEmailExplanation') }}: -

-
- - - -
@@ -121,6 +123,7 @@ import {ConfidentialAdvisor} from "@/scripts/config"; import {InputValidationRules} from "@/main"; import {Report} from "@/scripts/report" import MaterialBanner from "@/views/components/MaterialBanner.vue" +import {VForm} from "vuetify/components"; interface Data { error: string | undefined, @@ -180,9 +183,7 @@ export default defineComponent({ required: [ v => !!v || this.$t("home.form.required") ], - optionalEmail: [ - v => v ? (/[^@ \t\r\n]+@[^@ \t\r\n]+\.[^@ \t\r\n]+/.test(v) || this.$t('home.form.invalidEmail')) : true - ] + optionalEmail: this.optionalEmailRules() } } }, @@ -190,6 +191,15 @@ export default defineComponent({ this.loadAdvisors(); }, methods: { + optionalEmailRules(): InputValidationRules { + return [ + v => this.report.allowContact ? !!v || this.$t("home.form.required") : true, + v => v ? (/[^@ \t\r\n]+@[^@ \t\r\n]+\.[^@ \t\r\n]+/.test(v) || this.$t('home.form.invalidEmail')) : true + ]; + }, + async validateForm(): Promise { + return (await ( this.$refs.form).validate()).valid; + }, async loadAdvisors() { const r = await ConfidentialAdvisor.list(); if(r.isErr()) { @@ -201,7 +211,7 @@ export default defineComponent({ this.receivers.push(new Receiver(this.$t('home.form.board'), new BoardReceiver(), ReceiverType.BOARD)); }, async submitForm() { - if(!this.report.valid) { + if(!this.report.valid || !(await this.validateForm())) { this.error = this.$t("home.form.invalid"); return; } @@ -219,7 +229,7 @@ export default defineComponent({ .length > 0; this.report.loading = true; - const r = await Report.report(this.report.message!, toBoard, toAdvisors, this.report.contactEmail); + const r = await Report.report(this.report.message!, toBoard, toAdvisors, this.report.allowContact ? this.report.contactEmail : null); this.report.loading = false; if(r.isErr()) {