Skip to content

Commit

Permalink
Create address during registration option (#63)
Browse files Browse the repository at this point in the history
  • Loading branch information
@indykoning
indykoning authored Jan 9, 2024
1 parent 66daf97 commit 7b04df7
Show file tree
Hide file tree
Showing 3 changed files with 183 additions and 67 deletions.
4 changes: 4 additions & 0 deletions config/rapidez/checkout-theme.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,4 +28,8 @@
'register' => false
],
],
'register' => [
// Make the user create an address during registration.
'create-address' => false,
],
];
80 changes: 80 additions & 0 deletions resources/views/account/partials/register-account-address.blade.php
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,80 @@
<div>
<div>
<x-rapidez-ct::title.lg class="mt-5 mb-3">
@lang('Contact information')
</x-rapidez-ct::title.lg>
<div class="flex flex-col space-y-3">
<div class="flex sm:flex-row flex-col sm:space-x-3">
<div class="flex-1">
<x-rapidez-ct::input name="firstname" label="Firstname" v-model="addressVariables.firstname" required />
</div>
@if(Rapidez::config('customer/address/middlename_show', 0))
<div class="flex-1">
<x-rapidez-ct::input name="middlename" label="Middlename" v-model="addressVariables.middlename" />
</div>
@endif
<div class="flex-1">
<x-rapidez-ct::input name="lastname" label="Lastname" v-model="addressVariables.lastname" required />
</div>
</div>
@if(Rapidez::config('customer/address/telephone_show', 'req'))
<x-rapidez-ct::input name="telephone" label="Telephone" v-model="addressVariables.telephone" :required="Rapidez::config('customer/address/telephone_show', 'req') == 'req'" />
@endif

@if(Rapidez::config('customer/address/company_show', 'opt'))
<x-rapidez-ct::input name="company" label="Company" v-model="addressVariables.company" :required="Rapidez::config('customer/address/company_show', 'opt') == 'req'" />
@endif
@if(Rapidez::config('customer/address/taxvat_show', 0))
<x-rapidez-ct::input
name="vat_id"
label="Vat ID"
v-model="addressVariables.vat_id"
:required="Rapidez::config('customer/address/taxvat_show', 0) == 'req'"
/>
@endif
</div>
</div>

<div>
<x-rapidez-ct::title.lg class="mt-5 mb-3">
@lang('Address')
</x-rapidez-ct::title.lg>
<div class="flex flex-col space-y-3">
<div class="flex sm:flex-row flex-col sm:space-x-3">
<div class="flex-1">
<x-rapidez-ct::input name="street[0]" v-model="addressVariables.street[0]" :label="__('Street')" placeholder="" required />
</div>
@if(Rapidez::config('customer/address/street_lines', 2) >= 2)
<div class="flex-1">
<x-rapidez-ct::input name="street[1]" type="number" label="Housenumber" v-model="addressVariables.street[1]" placeholder="" />
</div>
@endif
@if(Rapidez::config('customer/address/street_lines', 2) >= 3)
<div class="flex-1">
<x-rapidez-ct::input name="street[2]" label="Addition" v-model="addressVariables.street[2]" placeholder="" />
</div>
@endif
@if(Rapidez::config('customer/address/street_lines', 2) >= 4)
<div class="flex-1">
<x-rapidez-ct::input name="street[3]" v-model="addressVariables.street[3]" placeholder="" />
</div>
@endif
</div>

<x-rapidez-ct::input name="postcode" label="Postcode" v-model="addressVariables.postcode" required />
<x-rapidez-ct::input name="city" label="City" v-model="addressVariables.city" required />
<span class="relative flex flex-col gap-y-1.5 sm:gap-y-2 text-sm !mb-3">
<x-rapidez-ct::input.label :required="true">
@lang('Country')
</x-rapidez-ct::input.label>
<x-rapidez-ct::input.country-select
name="country_code"
label="Country"
v-model="addressVariables.country_code"
class="w-full"
required
/>
</span>
</div>
</div>
</div>
166 changes: 99 additions & 67 deletions resources/views/account/partials/register-account.blade.php
View file
Original file line number Diff line number Diff line change
@@ -1,70 +1,102 @@
<x-rapidez::recaptcha location="customer_create"/>

<graphql-mutation
query="@include('rapidez-ct::account.partials.queries.register-account')"
redirect="{{ route('account.overview') }}"
:callback="registerCallback"
:recaptcha="{{ Rapidez::config('recaptcha_frontend/type_for/customer_create') == 'recaptcha_v3' ? 'true' : 'false' }}"
v-slot="{ mutate, variables }"
key="address-create"
query="@include('rapidez::account.partials.queries.address-create')"
:watch="false"
:variables="{ street: [], default_billing: true, default_shipping: true }"
v-slot="{ mutate: createAddress, variables: addressVariables }"
>
<x-rapidez-ct::sections>
<x-rapidez-ct::card.inactive>
<x-rapidez-ct::title.lg class="mb-5">
@lang('Register account')
</x-rapidez-ct::title.lg>
<form id="register" class="grid gap-5 sm:grid-cols-2" v-on:submit.prevent="mutate">
<x-rapidez-ct::input
name="firstname"
label="Firstname"
type="text"
v-model="variables.firstname"
required
/>
<x-rapidez-ct::input
name="lastname"
label="Lastname"
type="text"
v-model="variables.lastname"
required
/>
<x-rapidez-ct::input
name="email"
label="Email"
type="email"
v-model="variables.email"
required
/>
<x-rapidez-ct::input.password
name="password"
Label="Password"
v-model="variables.password"
required
/>
@if(Rapidez::config('customer/create_account/vat_frontend_visibility', 0))
<toggler>
<div slot-scope="{ toggle, isOpen }" class="contents">
<x-rapidez-ct::input.checkbox
id="isb2b"
name="isb2b"
v-model="isOpen"
v-on:click="toggle"
>
@lang('This is a business account')
</x-rapidez-ct::input.checkbox>
<x-rapidez-ct::input
v-cloak
v-if="isOpen"
name="taxvat"
label="Vat ID"
type="text"
v-model="variables.taxvat"
required
/>
</div>
</toggler>
@endif
</form>
</x-rapidez-ct::card.inactive>
<x-rapidez::recaptcha location="customer_create"/>
<graphql-mutation
query="@include('rapidez-ct::account.partials.queries.register-account')"
redirect="{{ route('account.overview') }}"
:callback="async (variables, response) => {
await registerCallback(variables, response);
@if(config('rapidez.checkout-theme.register.create-address'))
await createAddress();
@endif
}"
:recaptcha="{{ Rapidez::config('recaptcha_frontend/type_for/customer_create') == 'recaptcha_v3' ? 'true' : 'false' }}"
v-slot="{ mutate, variables }"
>
<x-rapidez-ct::sections>
<x-rapidez-ct::card.inactive>
<x-rapidez-ct::title.lg class="mb-5">
@lang('Register account')
</x-rapidez-ct::title.lg>
<form
id="register"
class="grid gap-5 sm:grid-cols-2"
@if(config('rapidez.checkout-theme.register.create-address'))
v-on:submit.prevent="window.document.getElementById('register-address').reportValidity() && mutate()"
@else
v-on:submit.prevent="mutate"
@endif
>
<x-rapidez-ct::input
name="firstname"
label="Firstname"
type="text"
v-model="variables.firstname"
required
/>
<x-rapidez-ct::input
name="lastname"
label="Lastname"
type="text"
v-model="variables.lastname"
required
/>
<x-rapidez-ct::input
name="email"
label="Email"
type="email"
v-model="variables.email"
required
/>
<x-rapidez-ct::input.password
name="password"
Label="Password"
v-model="variables.password"
required
/>
@if(Rapidez::config('customer/create_account/vat_frontend_visibility', 0))
<toggler>
<div slot-scope="{ toggle, isOpen }" class="contents">
<x-rapidez-ct::input.checkbox
id="isb2b"
name="isb2b"
v-model="isOpen"
v-on:click="toggle"
>
@lang('This is a business account')
</x-rapidez-ct::input.checkbox>
<x-rapidez-ct::input
v-cloak
v-if="isOpen"
name="taxvat"
label="Vat ID"
type="text"
v-model="variables.taxvat"
required
/>
</div>
</toggler>
@endif
</form>
</x-rapidez-ct::card.inactive>
@if(config('rapidez.checkout-theme.register.create-address'))
<x-rapidez-ct::card.inactive>
<x-rapidez-ct::title.lg class="mb-5">
@lang('Address data')
</x-rapidez-ct::title.lg>
<form id="register-address">
@include('rapidez-ct::account.partials.register-account-address')
</form>
</x-rapidez-ct::card.inactive>
@endif

<x-rapidez-ct::newsletter v-model="variables.is_subscribed"/>
</x-rapidez-ct::sections>
</graphql-mutation>
<x-rapidez-ct::newsletter v-model="variables.is_subscribed"/>
</x-rapidez-ct::sections>
</graphql-mutation>
</graphql-mutation>

0 comments on commit 7b04df7

Please sign in to comment.