diff --git a/www/webapp/src/components/ActivateAccountActionHandler.vue b/www/webapp/src/components/ActivateAccountActionHandler.vue index dbcd7a29c..5ba36da9e 100644 --- a/www/webapp/src/components/ActivateAccountActionHandler.vue +++ b/www/webapp/src/components/ActivateAccountActionHandler.vue @@ -2,60 +2,22 @@
- - - - - - - Passwords can also be reset by sending an email to our support. - -
- - mdi-refresh - -   - - mdi-eye - mdi-ear-hearing - -
-
+
- Submit + Submit +

{{ this.response.data.detail }}

@@ -64,60 +26,35 @@ diff --git a/www/webapp/src/views/ResetPassword.vue b/www/webapp/src/views/ResetPassword.vue index 969658a15..83d7589f0 100644 --- a/www/webapp/src/views/ResetPassword.vue +++ b/www/webapp/src/views/ResetPassword.vue @@ -53,52 +53,12 @@ tabindex="1" /> - - - - - - - - Passwords can also be reset by sending an email to our support. - -
- - mdi-refresh - -   - - mdi-eye - mdi-ear-hearing - -
-
-
+ ({ valid: false, working: false, done: false, - captchaWorking: true, errors: [], - captcha: null, /* email field */ email: '', @@ -147,31 +107,17 @@ email_errors: [], /* captcha field */ + captchaID: null, captchaSolution: '', - captcha_rules: [v => !!v || 'Please enter the text displayed in the picture so we are (somewhat) convinced you are human'], captcha_errors: [], - captcha_kind: 'image', }), async mounted() { if ('email' in this.$route.params && this.$route.params.email !== undefined) { this.email = this.$route.params.email; } - this.getCaptcha(); this.initialFocus(); }, methods: { - async getCaptcha(focus = false) { - this.captchaWorking = true; - this.captchaSolution = ""; - try { - this.captcha = (await HTTP.post('captcha/', {kind: this.captcha_kind})).data; - if(focus) { - this.$refs.captchaField.focus() - } - } finally { - this.captchaWorking = false; - } - }, async initialFocus() { return this.$refs.emailField.focus(); }, @@ -185,18 +131,18 @@ await HTTP.post('auth/account/reset-password/', { email: this.email, captcha: { - id: this.captcha.id, + id: this.captchaID, solution: this.captchaSolution, }, }); this.done = true; } catch (ex) { - this.getCaptcha(true); + await this.$refs.captchaField.getCaptcha(true); let errors = await digestError(ex); for (const c in errors) { if (c === 'captcha') { - this.captcha_errors.push(...(errors[c]['non_field_errors'] ?? [])); - this.captcha_errors.push(...(errors[c]['solution'] ?? [])); + this.$refs.captchaField.addError(...(errors[c]['non_field_errors'] ?? [])); + this.$refs.captchaField.addError(...(errors[c]['solution'] ?? [])); } else { this.errors.push(...errors[c]); } @@ -205,13 +151,6 @@ this.working = false; }, }, - watch: { - captcha_kind: function (oldKind, newKind) { - if (oldKind !== newKind) { - this.getCaptcha(); - } - }, - }, }; diff --git a/www/webapp/src/views/SignUp.vue b/www/webapp/src/views/SignUp.vue index 4f9e6f56c..2e465dfac 100644 --- a/www/webapp/src/views/SignUp.vue +++ b/www/webapp/src/views/SignUp.vue @@ -77,50 +77,12 @@ /> - - - - - - - Sign up is also possible by sending an email to our support. - -
- - mdi-refresh - -   - - mdi-eye - mdi-ear-hearing - -
-
+
@@ -177,6 +139,7 @@ import {domain_pattern, email_pattern} from '@/validation'; import {digestError} from '@/utils'; import ErrorAlert from "@/components/ErrorAlert"; + import GenericCaptcha from "@/components/Field/GenericCaptcha.vue"; const LOCAL_PUBLIC_SUFFIXES = process.env.VUE_APP_LOCAL_PUBLIC_SUFFIXES.split(' '); @@ -189,14 +152,13 @@ export default { name: 'SignUp', components: { + GenericCaptcha, ErrorAlert, }, data: () => ({ valid: false, working: false, - captchaWorking: true, errors: [], - captcha: null, LOCAL_PUBLIC_SUFFIXES: LOCAL_PUBLIC_SUFFIXES, /* email field */ @@ -205,10 +167,8 @@ email_errors: [], /* captcha field */ + captchaID: null, captchaSolution: '', - captcha_rules: [v => !!v || 'Please enter the text displayed in the picture so we are (somewhat) convinced you are human'], - captcha_errors: [], - captcha_kind: 'image', /* outreach preference */ outreach_preference: true, @@ -228,25 +188,12 @@ if ('email' in this.$route.params && this.$route.params.email !== undefined) { this.email = this.$route.params.email; } - this.getCaptcha(); - this.initialFocus(); + await this.initialFocus(); }, created() { this.domainType = this.$route.query.domainType || 'custom'; }, methods: { - async getCaptcha(focus = false) { - this.captchaWorking = true; - this.captchaSolution = ""; - try { - this.captcha = (await HTTP.post('captcha/', {kind: this.captcha_kind})).data; - if(focus) { - this.$refs.captchaField.focus() - } - } finally { - this.captchaWorking = false; - } - }, async initialFocus() { if(this.$route.query.domainType === undefined) { return; @@ -268,22 +215,22 @@ email: this.email, password: null, captcha: { - id: this.captcha.id, - solution: this.captchaSolution.toUpperCase(), + id: this.captchaID, + solution: this.captchaSolution, }, domain: domain, outreach_preference: this.outreach_preference, }); this.$router.push({name: 'welcome', params: domain !== '' ? {domain: domain} : {}}); } catch (ex) { - this.getCaptcha(true); + await this.$refs.captchaField.getCaptcha(true); let errors = await digestError(ex); for (const c in errors) { if (c === undefined) { this.errors.push(...errors[c]); } else if (c === 'captcha') { - this.captcha_errors.push(...(errors[c]['non_field_errors'] ?? [])); - this.captcha_errors.push(...(errors[c]['solution'] ?? [])); + this.$refs.captchaField.addError(...(errors[c]['non_field_errors'] ?? [])); + this.$refs.captchaField.addError(...(errors[c]['solution'] ?? [])); } else if (c === 'domain') { this.domain_errors.push(...errors[c]); } else if (c === 'email') { @@ -305,11 +252,6 @@ this.$refs.domainField.validate(); }) }, - captcha_kind: function (oldKind, newKind) { - if (oldKind !== newKind) { - this.getCaptcha(); - } - }, }, };