Skip to content

Commit

Permalink
Replace inputs / buttons for blade-componens input/buttons
Browse files Browse the repository at this point in the history
  • Loading branch information
Roene-JustBetter committed Nov 5, 2024
1 parent 4e9ad46 commit 9e467db
Show file tree
Hide file tree
Showing 38 changed files with 381 additions and 382 deletions.
5 changes: 2 additions & 3 deletions resources/views/cart/coupon/add.blade.php
Original file line number Diff line number Diff line change
Expand Up @@ -10,15 +10,14 @@
>
<form v-on:submit.prevent="mutate" class="flex gap-3">
<x-rapidez::input
:label="false"
name="couponCode"
placeholder="Coupon code"
v-model="variables.coupon_code"
v-bind:disabled="$root.loading"
required
/>
<x-rapidez::button type="submit" class="sm:text-sm" dusk="apply-coupon">
<x-rapidez::button.outline type="submit" class="sm:text-sm" dusk="apply-coupon">
@lang('Apply')
</x-rapidez::button>
</x-rapidez::button.outline>
</form>
</graphql-mutation>
5 changes: 2 additions & 3 deletions resources/views/cart/item/quantity.blade.php
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@
<x-rapidez::input
name="qty"
type="number"
:label="false"
v-model="variables.quantity"
v-bind:dusk="'qty-'+index"
{{-- TODO: We don't need these importants with Tailwind merge and center isn't really center with type number --}}
Expand All @@ -19,8 +18,8 @@ class="!w-14 !px-1 text-center"
::max="item.product.stock_item?.max_sale_qty"
::step="item.product.stock_item?.qty_increments"
/>
<x-rapidez::button type="submit" v-bind:dusk="'item-update-'+index" :title="__('Update')">
<x-rapidez::button.primary type="submit" v-bind:dusk="'item-update-'+index" :title="__('Update')">
<x-heroicon-s-arrow-path class="h-4 w-4" />
</x-rapidez::button>
</x-rapidez::button.primary>
</form>
</graphql-mutation>
6 changes: 3 additions & 3 deletions resources/views/cart/sidebar.blade.php
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<dl class="mb-5 flex w-full flex-col rounded-lg border [&>*]:flex [&>*]:flex-wrap [&>*]:justify-between [&>*]:p-3 [&>*]:border-b [&>*:last-child]:border-none">
<dl class="mb-5 flex w-full flex-col rounded-lg border *:flex *:flex-wrap *:justify-between *:p-3 *:border-b [&>*:last-child]:border-none">
<div>
<dt>@lang('Subtotal')</dt>
<dd v-if="showTax">@{{ cart.prices.subtotal_including_tax.value | price }}</dd>
Expand Down Expand Up @@ -42,6 +42,6 @@
</div>
</dl>

<x-rapidez::button href="{{ route('checkout') }}" dusk="checkout" class="w-full text-center">
<x-rapidez::button.enhanced href="{{ route('checkout') }}" dusk="checkout" class="w-full text-center">
@lang('Checkout')
</x-rapidez::button>
</x-rapidez::button.enhanced>
4 changes: 2 additions & 2 deletions resources/views/checkout/pages/credentials.blade.php
Original file line number Diff line number Diff line change
Expand Up @@ -33,9 +33,9 @@ class="flex flex-col gap-5"
@include('rapidez::checkout.steps.shipping_method')
</template>

<x-rapidez::button type="submit" dusk="continue" class="self-start">
<x-rapidez::button.enhanced type="submit" dusk="continue" class="self-start">
@lang('Next')
</x-rapidez::button>
</x-rapidez::button.enhanced>
</form>
</div>
<div class="w-full xl:w-1/4">
Expand Down
4 changes: 2 additions & 2 deletions resources/views/checkout/pages/login.blade.php
Original file line number Diff line number Diff line change
Expand Up @@ -20,9 +20,9 @@ class="max-w-md mx-auto"
>
@include('rapidez::checkout.steps.login')

<x-rapidez::button type="submit" dusk="continue" class="mt-3">
<x-rapidez::button.enhanced type="submit" dusk="continue" class="mt-3">
@lang('Next')
</x-rapidez::button>
</x-rapidez::button.enhanced>
</form>
</div>
@endsection
257 changes: 143 additions & 114 deletions resources/views/checkout/partials/address.blade.php
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<div class="col-span-12" v-if="$root.loggedIn">
<graphql query="{ customer { addresses { id firstname lastname street city postcode country_code } } }">
<div v-if="data" slot-scope="{ data }">
<x-rapidez::select v-model="variables.customer_address_id" label="">
<x-rapidez::input.select v-model="variables.customer_address_id">
<option v-for="address in data.customer.addresses" :value="address.id">
@{{ address.firstname }} @{{ address.lastname }}
- @{{ address.street[0] }} @{{ address.street[1] }} @{{ address.street[2] }}
Expand All @@ -11,171 +11,200 @@
- @{{ address.country_code }}
</option>
<option :value="null">@lang('New address')</option>
</x-rapidez::select>
</x-rapidez::input.select>
</div>
</graphql>
</div>

<div class="contents" v-if="!$root.loggedIn || !variables.customer_address_id">
@if (Rapidez::config('customer/address/prefix_show', '') && strlen(Rapidez::config('customer/address/prefix_options', '')))
<div class="col-span-12">
<x-rapidez::select
name="{{ $type }}_prefix"
label="Prefix"
v-model="variables.prefix"
:required="Rapidez::config('customer/address/prefix_show', 'opt') == 'req'"
>
@if (Rapidez::config('customer/address/prefix_show', '') === 'opt')
<option value=""></option>
@endif
@foreach (explode(';', Rapidez::config('customer/address/prefix_options', '')) as $prefix)
<option value="{{ $prefix }}">
@lang($prefix)
</option>
@endforeach
</x-rapidez::select>
<label>
<x-rapidez::label>@lang('Prefix')</x-rapidez::label>
<x-rapidez::input.select
name="{{ $type }}_prefix"
v-model="variables.prefix"
:required="Rapidez::config('customer/address/prefix_show', 'opt') == 'req'"
>
@if (Rapidez::config('customer/address/prefix_show', '') === 'opt')
<option value=""></option>
@endif
@foreach (explode(';', Rapidez::config('customer/address/prefix_options', '')) as $prefix)
<option value="{{ $prefix }}">
@lang($prefix)
</option>
@endforeach
</x-rapidez::input.select>
</label>
</div>
@endif
<div class="col-span-12 {{ Rapidez::config('customer/address/middlename_show', 0) ? 'sm:col-span-4' : 'sm:col-span-6' }}">
<x-rapidez::input
label="Firstname"
name="{{ $type }}_firstname"
v-model="variables.firstname"
required
/>
<label>
<x-rapidez::label>@lang('Firstname')</x-rapidez::label>
<x-rapidez::input
name="{{ $type }}_firstname"
v-model="variables.firstname"
required
/>
</label>
</div>
@if (Rapidez::config('customer/address/middlename_show', 0))
<div class="col-span-12 sm:col-span-4">
<x-rapidez::input
name="{{ $type }}_middlename"
label="Middlename"
v-model="variables.middlename"
/>
<label>
<x-rapidez::label>@lang('Middlename')</x-rapidez::label>
<x-rapidez::input
name="{{ $type }}_middlename"
v-model="variables.middlename"
/>
</label>
</div>
@endif
<div class="col-span-12 {{ Rapidez::config('customer/address/middlename_show', 0) ? 'sm:col-span-4' : 'sm:col-span-6' }}">
<x-rapidez::input
name="{{ $type }}_lastname"
label="Lastname"
v-model="variables.lastname"
required
/>
<label>
<x-rapidez::label>@lang('Lastname')</x-rapidez::label>
<x-rapidez::input
name="{{ $type }}_lastname"
v-model="variables.lastname"
required
/>
</label>
</div>
@if (Rapidez::config('customer/address/suffix_show', '') && strlen(Rapidez::config('customer/address/suffix_options', '')))
<div class="col-span-12">
<x-rapidez::select
name="{{ $type }}_suffix"
label="Suffix"
v-model="variables.suffix"
:required="Rapidez::config('customer/address/suffix_show', 'opt') == 'req'"
>
@if (Rapidez::config('customer/address/suffix_show', '') === 'opt')
<option value=""></option>
@endif
@foreach (explode(';', Rapidez::config('customer/address/suffix_options', '')) as $suffix)
<option value="{{ $suffix }}">
@lang($suffix)
</option>
@endforeach
</x-rapidez::select>
<label>
<x-rapidez::label>@lang('Suffix')</x-rapidez::label>
<x-rapidez::input.select
name="{{ $type }}_suffix"
v-model="variables.suffix"
:required="Rapidez::config('customer/address/suffix_show', 'opt') == 'req'"
>
@if (Rapidez::config('customer/address/suffix_show', '') === 'opt')
<option value=""></option>
@endif
@foreach (explode(';', Rapidez::config('customer/address/suffix_options', '')) as $suffix)
<option value="{{ $suffix }}">
@lang($suffix)
</option>
@endforeach
</x-rapidez::input.select>
</label>
</div>
@endif
<div class="col-span-6 sm:col-span-3">
<x-rapidez::input
name="{{ $type }}_postcode"
label="Postcode"
v-model="variables.postcode"
v-on:change="$root.$nextTick(() => window.app.$emit('postcode-change', variables))"
required
/>
</div>
@if (Rapidez::config('customer/address/street_lines', 2) >= 2)
<div class="col-span-6 sm:col-span-3">
<label>
<x-rapidez::label>@lang('Postcode')</x-rapidez::label>
<x-rapidez::input
name="{{ $type }}_housenumber"
label="Housenumber"
v-model="variables.street[1]"
name="{{ $type }}_postcode"
v-model="variables.postcode"
v-on:change="$root.$nextTick(() => window.app.$emit('postcode-change', variables))"
required
/>
</label>
</div>
@if (Rapidez::config('customer/address/street_lines', 2) >= 2)
<div class="col-span-6 sm:col-span-3">
<label>
<x-rapidez::label>@lang('Housenumber')</x-rapidez::label>
<x-rapidez::input
name="{{ $type }}_housenumber"
v-model="variables.street[1]"
v-on:change="$root.$nextTick(() => window.app.$emit('postcode-change', variables))"
required
/>
</label>
</div>
@endif
@if (Rapidez::config('customer/address/street_lines', 2) >= 3)
<div class="col-span-6 sm:col-span-3">
<x-rapidez::input
name="{{ $type }}_addition"
label="Addition"
v-model="variables.street[2]"
/>
<label>
<x-rapidez::label>@lang('Addition')</x-rapidez::label>
<x-rapidez::input
name="{{ $type }}_addition"
v-model="variables.street[2]"
/>
</label>
</div>
@endif
<div class="col-span-6 sm:col-span-3">
<x-rapidez::input
name="{{ $type }}_street"
label="Street"
v-model="variables.street[0]"
required
/>
<label>
<x-rapidez::label>@lang('Street')</x-rapidez::label>
<x-rapidez::input
name="{{ $type }}_street"
v-model="variables.street[0]"
required
/>
</label>
</div>
<div class="col-span-12 sm:col-span-6 sm:col-start-1">
<x-rapidez::input
name="{{ $type }}_city"
label="City"
v-model="variables.city"
required
/>
<label>
<x-rapidez::label>@lang('City')</x-rapidez::label>
<x-rapidez::input
name="{{ $type }}_city"
v-model="variables.city"
required
/>
</label>
</div>
<div class="col-span-12 sm:col-span-6">
<x-rapidez::country-select
name="{{ $type }}_country"
dusk="{{ $type }}_country"
label="Country"
v-model="variables.country_code"
v-on:change="$root.$nextTick(() => window.app.$emit('postcode-change', variables))"
required
/>
<label>
<x-rapidez::label>@lang('Country')</x-rapidez::label>
<x-rapidez::country-select
name="{{ $type }}_country"
dusk="{{ $type }}_country"
v-model="variables.country_code"
v-on:change="$root.$nextTick(() => window.app.$emit('postcode-change', variables))"
required
/>
</label>
</div>
@if (Rapidez::config('customer/address/telephone_show', 'req'))
<div class="col-span-12 sm:col-span-6 sm:col-start-1">
<x-rapidez::input
name="{{ $type }}_telephone"
label="Telephone"
v-model="variables.telephone"
:required="Rapidez::config('customer/address/telephone_show', 'req') == 'req'"
/>
<label>
<x-rapidez::label>@lang('Telephone')</x-rapidez::label>
<x-rapidez::input
name="{{ $type }}_telephone"
v-model="variables.telephone"
:required="Rapidez::config('customer/address/telephone_show', 'req') == 'req'"
/>
</label>
</div>
@endif
@if (Rapidez::config('customer/address/fax_show', false))
<div class="col-span-12 sm:col-span-6">
<x-rapidez::input
name="{{ $type }}_fax"
label="Fax"
v-model="variables.fax"
:required="Rapidez::config('customer/address/fax_show', false) === 'req'"
/>
<label>
<x-rapidez::label>@lang('Fax')</x-rapidez::label>
<x-rapidez::input
name="{{ $type }}_fax"
v-model="variables.fax"
:required="Rapidez::config('customer/address/fax_show', false) === 'req'"
/>
</label>
</div>
@endif
@if (Rapidez::config('customer/address/company_show', 'opt'))
<div class="col-span-12 sm:col-span-6 sm:col-start-1">
<x-rapidez::input
name="{{ $type }}_company"
label="Company"
placeholder=""
v-model="variables.company"
:required="Rapidez::config('customer/address/company_show', 'opt') == 'req'"
/>
<label>
<x-rapidez::label>@lang('Company')</x-rapidez::label>
<x-rapidez::input
name="{{ $type }}_company"
v-model="variables.company"
:required="Rapidez::config('customer/address/company_show', 'opt') == 'req'"
/>
</label>
</div>
@endif
@if (Rapidez::config('customer/address/taxvat_show', 0))
<div class="col-span-12 sm:col-span-6">
<x-rapidez::input
name="{{ $type }}_vat_id"
label="Tax ID"
placeholder=""
v-model="variables.vat_id"
v-on:change="window.app.$emit('vat-change', $event)"
:required="Rapidez::config('customer/address/taxvat_show', 'opt') == 'req'"
/>
<label>
<x-rapidez::label>@lang('Tax ID')</x-rapidez::label>
<x-rapidez::input
name="{{ $type }}_vat_id"
v-model="variables.vat_id"
v-on:change="window.app.$emit('vat-change', $event)"
:required="Rapidez::config('customer/address/taxvat_show', 'opt') == 'req'"
/>
</label>
</div>
@endif
</div>
</div>
Loading

0 comments on commit 9e467db

Please sign in to comment.