protected static $_specifications = null;
protected static $_productTypes = null;
protected static $_specificationFields = null;
+ protected static $_cart_data;
/**
* @var array
*/
public static function getCartData()
{
-
- $cart_items = session('cart_items', []);
-
- $cart_data = [];
- $products = self::with('media')->whereIn('id', array_keys($cart_items))->get();
-
- foreach ($products as $product) {
- $cart_data[] = [
- 'id' => $product->id,
- 'name' => $product->name,
- 'reference' => $product->reference,
- 'category' => $product->type->name,
- 'quantity' => $cart_items[$product->id],
- 'image' => $product->image,
- 'URL' => $product->url,
- ];
+ if (!self::$_cart_data) {
+
+ $cart_items = session('cart_items', []);
+
+ self::$_cart_data = [];
+ $products = self::with('media')->whereIn('id', array_keys($cart_items))->get();
+
+ foreach ($products as $product) {
+ self::$_cart_data[] = [
+ 'id' => $product->id,
+ 'name' => $product->name,
+ 'reference' => $product->reference,
+ 'category' => $product->type->name,
+ 'quantity' => $cart_items[$product->id],
+ 'image' => $product->image,
+ 'URL' => $product->url,
+ ];
+ }
}
- return $cart_data;
+ return self::$_cart_data;
}
use Illuminate\Support\Facades\View;
use Illuminate\Support\Facades\Blade;
use Spatie\BladeX\Facades\BladeX;
+use App\Models\Product;
class AppServiceProvider extends ServiceProvider
{
$view_parts = explode('.', $view->getName());
$view_name = end($view_parts);
View::share('view_name', $view_name);
+
+ // Also share cart data with all views
+ View::share('cart_items', Product::getCartData());
});
try {
<template>
<div class="cart-item flex mb-1v text-base">
- <a class="block border-gray-100 border-2 bg-center bg-contain bg-no-repeat flex-shrink-0"
+ <a class="cart-item-image block border-gray-100 border-2 bg-center bg-contain bg-no-repeat w-full xs:hidden"
:href="item.URL"
- :style="`background-image: url(${item.image}); width: 144px; height: 144px`">
+ :style="`background-image: url(${item.image});`">
</a>
- <div class="pl-6 leading-relaxed flex-grow">
+ <div class="pl-6 xs:pl-0 leading-relaxed flex-grow">
<a :href="item.URL" class="block text-navy font-display">
<span class="text-grey-dark">{{ item.reference }}</span>
line-height: 1.5
max-width: 100%
min-height: 1.5em
- min-width: 2.5em
+ min-width: 2em
padding: 0.4375em 0.875em
transition: border-color 0.15s
width: 100%
& > input
box-sizing: content-box
display: inline-block
- width: 2.5em
+ width: 2em
padding: 0.4em 2.5em
&--center
.cart-quantity
@apply bg-white
max-width: 220px
+
+// Cart item
+.cart-item
+ &-image
+ max-width: 144px
+ max-height: @max-width
-.ajax-form,.notajax-form
+.ajax-form, .notajax-form
.fields
grid-column-gap: 30px
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+ +below(500px)
+ grid-template-columns: auto
+
.errormessage
- color theme('colors.red')
+ color: theme('colors.red')
font-weight: 300
position: absolute
right: 0
display: block
&:not(.half)
- grid-column 1 / -1
+ grid-column: 1 / -1
.textarea
height 144px
margin-bottom: 20px;
.btn-custom
- min-width 14rem
- padding 1.125rem 3.375rem
+ min-width: 14rem
+ padding: 1.125rem 3.375rem
+
+ +below(500px)
+ min-width: unset
+ padding-left: 1.5em
+ padding-right: @padding-left
<div v-if="cartItemCount > 0">
{{-- Columns set to auto because cart will disappear when quote form is sent, leaving just the confirmation message. --}}
- <grid cols="auto">
+ <grid cols="auto" class="sm:grid-cols-1">
{{-- Nested divs to allow grey backgrounds of columns to match the height of their content instead of total height --}}
<div>
<span class="cart-header-title">{{ __('Ma sélection') }}</span>
<span class="cart-header-icon-wrapper">
@svg('icon-cart', 'cart-header-icon')
- <span class="cart-header-count" v-html="cartItemCount"></span>
+ <span class="cart-header-count" v-html="cartItemCount">
+ {{ count($cart_items) }}
+ </span>
</span>
@if($page->get('form_intro'))
<div class="form-info text-navy mb-6">@markdown($page->get('form_intro'))</div>
@endif
- <form {!! $gaattrs !!} class="text-navy mailform" action="{{ $action ?? '/ajax/mailform' }}" method="post"
- data-confirmation="{{$page->get('form_confirmation')??__('Votre message a bien été envoyé')}}"
+ <form {!! $gaattrs !!}
+ class="text-navy mailform"
+ action="{{ $action ?? '/ajax/mailform' }}"
+ method="post"
+ data-confirmation="{{ $page->get('form_confirmation') ?? __('Votre message a bien été envoyé') }}"
novalidate>
@honeypot
- <input type="hidden" value="{{$page->get('id')}}" name="page">
+ <input type="hidden" value="{{ $page->get('id') }}" name="page">
{!! $extra_fields ?? '' !!}
<div class="fields grid">
@foreach($page->get('form') as $field)
@php
- $required=$field['mandatory']?' required':'';
- $asx=$field['mandatory']?' *':'';
+ $required = $field['mandatory'] ? ' required' : '';
+ $asx = $field['mandatory'] ? ' *' : '';
@endphp
<label class="form-input">
@switch($field['type'])
@case('name')
- {{__('Nom')}}{{$asx}} <input class="py-3 mt-3" type="text"
- {!! $required !!} name="name">
+ {{ __('Nom')}}{{ $asx}}
+ <input class="py-3 mt-3" type="text" {!! $required !!} name="name">
@break
@case('firstname')
- {{__('Prénom')}}{{$asx}} <input class="py-3 mt-3" type="text"
- {!! $required !!} name="firstname">
+ {{ __('Prénom')}}{{ $asx}}
+ <input class="py-3 mt-3" type="text" {!! $required !!} name="firstname">
@break
@case('company')
- {{__('Société')}}{{$asx}} <input class="py-3 mt-3" type="text"
- {!! $required !!} name="company">
+ {{ __('Société')}}{{ $asx}}
+ <input class="py-3 mt-3" type="text" {!! $required !!} name="company">
@break
@case('email')
- {{__('E-mail')}}{{$asx}} <input class="py-3 mt-3" type="email"
- {!! $required !!} name="email">
+ {{ __('E-mail')}}{{ $asx}}
+ <input class="py-3 mt-3" type="email" {!! $required !!} name="email">
@break
@case('ref')
- {{__('Référence')}}{{$asx}} <input class="py-3 mt-3" type="text"
- {!! $required !!} name="ref">
+ {{ __('Référence')}}{{ $asx}}
+ <input class="py-3 mt-3" type="text" {!! $required !!} name="ref">
@break
@case('sku')
- {{__('Numéro de série')}}{{$asx}} <input class="py-3 mt-3" type="text"
- {!! $required !!} name="sku">
+ {{ __('Numéro de série')}}{{ $asx}}
+ <input class="py-3 mt-3" type="text" {!! $required !!} name="sku">
@break
@case('subject')
- {{__('Sujet')}}{{$asx}} <input class="py-3 mt-3" type="text"
- {!! $required !!} name="subject">
+ {{ __('Sujet')}}{{ $asx}}
+ <input class="py-3 mt-3" type="text" {!! $required !!} name="subject">
@break
@case('message')
- {{__('Message')}}{{$asx}} <textarea class="py-3 textarea mt-3" type="text"
- {!! $required !!} name="message"></textarea>
+ {{ __('Message')}}{{ $asx}}
+ <textarea class="py-3 textarea mt-3" type="text" {!! $required !!} name="message"></textarea>
@break
@endswitch
</label>
<div class="form-endmessage my-6 text-grey-dark text-sm">
@markdown($global->get('form_privacy'))
</div>
- <div class="form-footer flex justify-between items-center xs:flex-col-reverse">
- <span
- class="form-required-legend text-grey-dark xs:self-start xs:mt-5">*{{__('Champs obligatoires')}}</span>
- <button type="submit" class="form-submit-button btn btn-custom xs:w-full"
- data-sending="{{__('Envoi en cours')}}">{{ $page->get('form_button_text', __('Envoyer')) }}</button>
+ <div class="form-footer flex flex-wrap-reverse justify-between items-center">
+ <span class="form-required-legend inline-block my-4 mr-3 text-grey-dark xs:self-start xs:mt-5">
+ *{{ __('Champs obligatoires')}}
+ </span>
+ <button type="submit"
+ class="form-submit-button btn btn-custom xs:w-full"
+ data-sending="{{ __('Envoi en cours')}}">
+ {{ $page->get('form_button_text', __('Envoyer')) }}
+ </button>
</div>
</form>
</div>
<nav id="menu" class="nav mx-auto flex items-center">
@include('partials.nav')
+ {{-- Todo: consider inverting the portal so the hidden search form is put in the portal instead of the icon (to avoid loading delay on icon) --}}
<portal-target name="nav-search-toggle" slim></portal-target>
</nav>