|
|
@@ -1,9 +1,6 @@
|
|
|
<!-- eslint-disable @intlify/vue-i18n/no-raw-text -->
|
|
|
<template>
|
|
|
<q-page class="login-page bg-surface-dark">
|
|
|
- <span class="text-text">
|
|
|
- {{steps}}
|
|
|
- </span>
|
|
|
<Transition name="fade-slide" mode="out-in">
|
|
|
<div v-if="!clicked" key="splash" class="splash-screen" @click="clicked = true">
|
|
|
<img :src="BackgroundLogin" class="splash-layer splash-layer--bg" />
|
|
|
@@ -17,6 +14,7 @@
|
|
|
</div>
|
|
|
|
|
|
<q-form
|
|
|
+ v-if="!registrationCompleted"
|
|
|
ref="loginForm"
|
|
|
class="flow-form"
|
|
|
autocorrect="off"
|
|
|
@@ -54,6 +52,16 @@
|
|
|
</q-btn>
|
|
|
</div>
|
|
|
</q-form>
|
|
|
+
|
|
|
+ <div v-else class="registration-complete">
|
|
|
+ <q-icon name="mdi-check-circle-outline" size="52px" color="positive" class="q-mb-md" />
|
|
|
+ <div class="registration-complete__title text-text fontbold">
|
|
|
+ {{ t('provider.login.registration_complete.title') }}
|
|
|
+ </div>
|
|
|
+ <div class="registration-complete__message text-grey-7 font12">
|
|
|
+ {{ t('provider.login.registration_complete.message') }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</Transition>
|
|
|
</q-page>
|
|
|
@@ -86,6 +94,7 @@ const { setAuthDataFromPayload } = useAuth();
|
|
|
|
|
|
const clicked = ref(false);
|
|
|
const showSubStep = ref(false);
|
|
|
+const registrationCompleted = ref(false);
|
|
|
const steps = ref(1);
|
|
|
const submitting = ref(false);
|
|
|
const loginForm = ref(null);
|
|
|
@@ -234,11 +243,16 @@ const registerUserAndProvider = async () => {
|
|
|
const workingDays = mapWorkingDays();
|
|
|
const form = new FormData();
|
|
|
|
|
|
+ const hasValue = (val) => val !== null && val !== undefined && String(val).trim() !== '';
|
|
|
const append = (key, val) => {
|
|
|
if (val === null || val === undefined) return;
|
|
|
if (typeof val === 'boolean') form.append(key, val ? '1' : '0');
|
|
|
else form.append(key, val);
|
|
|
};
|
|
|
+ const appendIfFilled = (key, val) => {
|
|
|
+ if (!hasValue(val)) return;
|
|
|
+ form.append(key, val);
|
|
|
+ };
|
|
|
|
|
|
append('name', stepThreeForm.value.name);
|
|
|
append('email', stepThreeForm.value.email || email.value);
|
|
|
@@ -277,26 +291,36 @@ const registerUserAndProvider = async () => {
|
|
|
append('recipient_email', stepThreeForm.value.email || email.value);
|
|
|
append('recipient_document', stepThreeForm.value.document);
|
|
|
append('recipient_type', 'individual');
|
|
|
- append('recipient_payment_mode', 'bank_transfer');
|
|
|
- append('recipient_default_bank_account[type]', stepSixForm.value.account_type);
|
|
|
- append('recipient_default_bank_account[bank]', stepSixForm.value.bank);
|
|
|
- append('recipient_default_bank_account[branch_number]', stepSixForm.value.branch_number);
|
|
|
- append('recipient_default_bank_account[branch_check_digit]', stepSixForm.value.branch_check_digit);
|
|
|
- append('recipient_default_bank_account[account_number]', stepSixForm.value.account_number);
|
|
|
- append('recipient_default_bank_account[account_check_digit]', stepSixForm.value.account_check_digit);
|
|
|
- append('recipient_default_bank_account[pix_key]', stepSixForm.value.pix_key);
|
|
|
- append('recipient_default_bank_account[holder_name]', stepThreeForm.value.name);
|
|
|
- append('recipient_default_bank_account[holder_document]', stepThreeForm.value.document);
|
|
|
- append('recipient_default_bank_account[holder_type]', 'individual');
|
|
|
+
|
|
|
+ const hasBankAccountData = [
|
|
|
+ stepSixForm.value.bank,
|
|
|
+ stepSixForm.value.branch_number,
|
|
|
+ stepSixForm.value.account_number,
|
|
|
+ stepSixForm.value.account_check_digit,
|
|
|
+ ].every(hasValue);
|
|
|
+
|
|
|
+ if (hasBankAccountData) {
|
|
|
+ append('recipient_payment_mode', 'bank_transfer');
|
|
|
+ append('recipient_default_bank_account[type]', stepSixForm.value.account_type);
|
|
|
+ append('recipient_default_bank_account[bank]', stepSixForm.value.bank);
|
|
|
+ append('recipient_default_bank_account[branch_number]', stepSixForm.value.branch_number);
|
|
|
+ appendIfFilled('recipient_default_bank_account[branch_check_digit]', stepSixForm.value.branch_check_digit);
|
|
|
+ append('recipient_default_bank_account[account_number]', stepSixForm.value.account_number);
|
|
|
+ append('recipient_default_bank_account[account_check_digit]', stepSixForm.value.account_check_digit);
|
|
|
+ appendIfFilled('recipient_default_bank_account[pix_key]', stepSixForm.value.pix_key);
|
|
|
+ append('recipient_default_bank_account[holder_name]', stepThreeForm.value.name);
|
|
|
+ append('recipient_default_bank_account[holder_document]', stepThreeForm.value.document);
|
|
|
+ append('recipient_default_bank_account[holder_type]', 'individual');
|
|
|
+ }
|
|
|
|
|
|
const response = await createUserAndProvider(form);
|
|
|
- if (response.status === 200) {
|
|
|
- await setAuthDataFromPayload(response.data.payload);
|
|
|
- router.push({ name: 'DashboardPage' });
|
|
|
+ if (response.status >= 200 && response.status < 300) {
|
|
|
+ registrationCompleted.value = true;
|
|
|
}
|
|
|
};
|
|
|
|
|
|
const onSubmit = async () => {
|
|
|
+ if (registrationCompleted.value) return;
|
|
|
if (showSubStep.value) return; // Não submete o form principal se estiver em um sub-passo
|
|
|
|
|
|
const isValid = await loginForm.value.validate();
|
|
|
@@ -453,4 +477,26 @@ const onSubmit = async () => {
|
|
|
.flow-footer {
|
|
|
padding: 20px 0 12px;
|
|
|
}
|
|
|
+
|
|
|
+.registration-complete {
|
|
|
+ flex: 1;
|
|
|
+ min-height: 0;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ padding: 24px 8px 80px;
|
|
|
+ text-align: center;
|
|
|
+
|
|
|
+ &__title {
|
|
|
+ font-size: 18px;
|
|
|
+ line-height: 1.25;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__message {
|
|
|
+ max-width: 320px;
|
|
|
+ line-height: 1.45;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|