259 lines
15 KiB
PHP
259 lines
15 KiB
PHP
@extends('layouts.frontend')
|
||
@section('title', __('Nous contacter'))
|
||
@section('description', __("Découvrez DOUX, des produits de volailles françaises."))
|
||
|
||
@section('content')
|
||
|
||
<section class="jumbotron">
|
||
<p class="maintitle ttu animate__animated fadeIn animate__slow">{{ __('Nous contacter') }}</p>
|
||
<img class="img-zoom" src="{{ asset('assets/images/contact.jpg') }}" alt="Nous contacter">
|
||
<div class="banner">
|
||
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1919.76 59.99">
|
||
<defs>
|
||
<style>
|
||
.cls-1 {
|
||
fill: #ffffff;
|
||
}
|
||
|
||
.cls-2 {
|
||
fill: transparent;
|
||
}
|
||
</style>
|
||
</defs>
|
||
<path class="cls-1" d="M1919.67,58c-.42.62,1,2.12-1,2-1.17-.07-2.34,0-3.5,0H0V55c3-.06,6,.08,9-.22,28.32-2.84,56.61-6,85-8.6q59.19-5.38,118.44-10c46.65-3.58,93.32-7,140-9.88,49.7-3.05,99.43-5.85,149.18-7.9,68.4-2.81,136.83-5,205.26-7.06,38.63-1.14,77.28-1.58,115.92-1.94,78.47-.74,156.93-.9,235.39.32,37.81.59,75.62,1.2,113.42,2.09q64.44,1.5,128.85,4,76.89,2.85,153.71,6.91,63.36,3.32,126.66,7.44,43.86,2.85,87.7,6,33.13,2.4,66.22,5.17,38.82,3.23,77.61,6.72c20.06,1.79,40.11,3.73,60.16,5.6Z" />
|
||
<path class="cls-2" d="M1919.67,58l-47.21-4.36c-20-1.87-40.1-3.81-60.16-5.6q-38.79-3.47-77.61-6.72-33.09-2.74-66.22-5.17-43.83-3.18-87.7-6-63.3-4.11-126.66-7.44-76.83-4-153.71-6.91-64.41-2.4-128.85-4c-37.8-.89-75.61-1.5-113.42-2.09-78.46-1.22-156.92-1.06-235.39-.32-38.64.36-77.29.8-115.92,1.94-68.43,2-136.86,4.25-205.26,7.06-49.75,2-99.48,4.85-149.18,7.9-46.7,2.87-93.37,6.3-140,9.88q-59.27,4.54-118.44,10c-28.35,2.58-56.64,5.76-85,8.6-3,.3-6,.16-9,.22V0H1919.67Z" />
|
||
</svg>
|
||
</div>
|
||
</section>
|
||
|
||
<div class="container contact-page has-bckg--grey is-flex horizontal-center">
|
||
<svg id="picto-localisation" class="p-abs" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 171 236"><defs>
|
||
<style>.cls-1{fill-rule:evenodd;}</style>
|
||
</defs><path class="cls-1" d="M85,236C60,197,0,131,0,85A84.93,84.93,0,0,1,85,0c48,0,86,38,86,85C171,131,111,197,85,236ZM85,43c24,0,43,19,43,42a42.68,42.68,0,0,1-43,43c-23,0-42-19-42-43A42.25,42.25,0,0,1,85,43Z"/>
|
||
</svg>
|
||
<p>
|
||
<strong>{{ __('Adresse') }}</strong><br /><br />
|
||
DOUX FARMOR<br />
|
||
450 Route de Rosporden<br />
|
||
Le Grand Guelen<br />
|
||
29000 QUIMPER, France
|
||
</p>
|
||
</div>
|
||
|
||
<div class="container">
|
||
<div class="wrapper">
|
||
<div class="breadcrumb is-flex">
|
||
<a href="{{ route($routeprefixer . 'home') }}" class="link">{{ __('Accueil') }}</a>
|
||
</div>
|
||
<div class="header-title sectiontitle align-center p-rel">
|
||
<h2 class="punchline-module__title align-center animate__animated fadeInUp animate__slow">{!! __('Une question ? Une idée ? Un conseil ?<br>Des informations sur nos produits ?') !!}</h2>
|
||
</div>
|
||
<p class="align-center">{!! __('N’hésitez-pas à nous contacter en renseignant le formulaire ci-dessous.<br>Nous traiterons votre demande avec la plus grande attention dans les meilleurs délais.') !!}</p>
|
||
@if(session()->has('status'))
|
||
<div class="form-result form-result_confirm">
|
||
<div class="form-result__title title title_small">{{ __('Votre message a bien été envoyé !') }}</div>
|
||
<div class="form-result__text">{{ __('Nos services mettent tout en oeuvre pour y répondre au plus vite.') }}</div>
|
||
</div>
|
||
@endif
|
||
<form action="{{route($routeprefixer . 'contact.submit')}}" method="post" class="form contact__form" enctype="multipart/form-data">
|
||
@csrf
|
||
@if ($errors->any())
|
||
@foreach ($errors->all() as $error)
|
||
<div class="field__error">{{ $error }}</div>
|
||
@endforeach
|
||
@endif
|
||
<fieldset>
|
||
<legend>{{ __('Vos coordonnées') }} :</legend>
|
||
|
||
<label class="radio-label">{{ __('Monsieur') }}
|
||
<input type="radio" checked="checked" name="civilite" value="monsieur" @if (old('civilite') === "monsieur" ) checked @endif>
|
||
<span class="checkmark"></span>
|
||
</label>
|
||
<label class="radio-label">{{ __('Madame') }}
|
||
<input type="radio" name="civilite" value="madame" @if (old('civilite') === "madame" ) checked @endif>
|
||
<span class="checkmark"></span>
|
||
</label>
|
||
|
||
<div class="form-row">
|
||
<div class="form-group">
|
||
<label for="name">{{ __('Nom') }}* : </label>
|
||
<input type="text" name="name" id="name" minlength="2" required value="{{old('name')}}">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="lastname">{{ __('Prénom') }}* : </label>
|
||
<input type="text" name="lastname" id="lastname" minlength="2" value="{{ old('lastname') }}" required>
|
||
</div>
|
||
</div>
|
||
<div class="form-row">
|
||
<div class="form-group">
|
||
<label for="address">{{ __('Adresse') }}* : </label>
|
||
<input type="text" name="address" id="address" maxlength="255" value="{{ old('address') }}" autocomplete="street-address" required>
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="postcode">{{ __('Code postal') }}* : </label>
|
||
<input type="text" name="postcode" id="postcode" minlength="1" maxlength="99000" value="{{ old('postcode') }}" autocomplete="postal-code" required>
|
||
</div>
|
||
</div>
|
||
<div class="form-row">
|
||
<div class="form-group">
|
||
<label for="city">{{ __('Ville') }}* : </label>
|
||
<input type="text" name="city" id="city" maxlength="255" value="{{ old('city') }}" autocomplete="address-level2" required>
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="phone">{{ __('Téléphone') }}* : </label>
|
||
<input type="number" name="phone" id="phone" min="1" max="9999999999" value="{{ old('phone') }}" autocomplete="tel" required>
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="email">{{ __('Email') }}* : </label>
|
||
<input type="mail" name="email" id="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$" value="{{ old('email') }}" autocomplete="email" required>
|
||
</div>
|
||
</div>
|
||
<div class="form-row">
|
||
<div class="country">
|
||
<select id="country" class="changeLength" maxlength="255" name="country" required onclick="javascript:showDromField(this);">
|
||
<option value="" @if(!old('country')) selected @endif>{{ __('Sélectionnez un pays') }} *</option>
|
||
@foreach($availableCountries as $country)
|
||
<option value="{{ $country->label }}" @if(old('country') == $country->label) selected @endif>{{ __($country->label) }}</option>
|
||
@endforeach
|
||
</select>
|
||
</div>
|
||
<div class="drom">
|
||
<select id="departement" class="changeLength" maxlength="255" name="departement">
|
||
<option value="" @if(!old('departement')) selected @endif>{{ __('Sélectionnez un département') }} *</option>
|
||
<option value="Guadeloupe" @if(old('departement') === 'Guadeloupe') selected @endif>{{ __('Guadeloupe') }}</option>
|
||
<option value="Martinique" @if(old('departement') === 'Martinique') selected @endif>{{ __('Martinique') }}</option>
|
||
<option value="Guyane" @if(old('departement') === 'Guyane') selected @endif>{{ __('Guyane') }}</option>
|
||
<option value="La Réunion" @if(old('departement') === 'La Réunion') selected @endif>{{ __('La Réunion') }}</option>
|
||
<option value="Mayotte" @if(old('departement') === 'Mayotte') selected @endif>{{ __('Mayotte') }}</option>
|
||
<option value="Saint-Pierre-et-Miquelon" @if(old('departement') === 'Saint-Pierre-et-Miquelon') selected @endif>{{ __('Saint-Pierre-et-Miquelon') }}</option>
|
||
<option value="Saint-Barthélémy" @if(old('departement') === 'Saint-Barthélémy') selected @endif>{{ __('Saint-Barthélémy') }}</option>
|
||
<option value="Saint-Martin" @if(old('departement') === 'Saint-Martin') selected @endif>{{ __('Saint-Martin') }}</option>
|
||
<option value="Polynésie française" @if(old('departement') === 'Polynésie française') selected @endif>{{ __('Polynésie française') }}</option>
|
||
<option value="Île de Clipperton" @if(old('departement') === 'Île de Clipperton') selected @endif>{{ __('Île de Clipperton') }}</option>
|
||
<option value="Wallis-et-Futuna" @if(old('departement') === 'Wallis-et-Futuna') selected @endif>{{ __('Wallis-et-Futuna') }}</option>
|
||
<option value="Nouvelle-Calédonie" @if(old('departement') === 'Nouvelle-Calédonie') selected @endif>{{ __('Nouvelle-Calédonie') }}</option>
|
||
<option value="Terres australes et antarctiques françaises" @if(old('departement') === 'Terres australes et antarctiques françaises') selected @endif>{{ __('Terres australes et antarctiques françaises') }}</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
</fieldset>
|
||
<fieldset>
|
||
<legend>{{ __('Préciser votre demande') }} :</legend>
|
||
<div class="ck-button">
|
||
<label>
|
||
<input type="radio" value="Réclamation" name="topic" onclick="javascript:showReclaFields();" @if (old('topic')=="Réclamation") checked @endif><span>{{ __('Réclamation produit') }}</span>
|
||
</label>
|
||
<label>
|
||
<input type="radio" value="La marque" name="topic" onclick="javascript:hideReclaFields();" @if (old('topic')=="La marque") checked @endif><span>{{ __('La marque') }}</span>
|
||
</label>
|
||
<label>
|
||
<input type="radio" value="Contact Commercial" onclick="javascript:hideReclaFields();" name="topic" @if (old('topic')=="Contact Commercial") checked @endif><span>{{ __('Contact commercial') }}</span>
|
||
</label>
|
||
<label>
|
||
<input type="radio" value="Autre" name="topic" onclick="javascript:hideReclaFields();" @if (old('topic')=="Autre") checked @endif><span>{{ __('Autre demande') }}</span>
|
||
</label>
|
||
</div>
|
||
<div class="form-row recla_field">
|
||
<div class="form-group">
|
||
<label for="address">{{ __('Nom du produit') }}* : </label>
|
||
<input type="text" name="product_name" id="product_name" value="{{ old('product_name') }}">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="barcode">{{ __('Code barre') }}* : </label>
|
||
<input type="number" name="barcode" id="barcode" value="{{ old('barcode') }}">
|
||
</div>
|
||
</div>
|
||
<div class="form-row recla_field">
|
||
<div class="form-group">
|
||
<label for="shop">{{ __("Lieu d'achat") }}* : </label>
|
||
<input type="text" name="shop" id="shop" value="{{ old('shop') }}">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="lot">{{ __('Numéro de lot') }}* : </label>
|
||
<input type="number" name="lot" id="lot" value="{{ old('lot') }}">
|
||
</div>
|
||
</div>
|
||
<div class="form-row recla_field">
|
||
<div class="form-group">
|
||
<label for="limit_date">{{ __('Date Limite de Consommation') }}* : </label>
|
||
<input type="date" name="limit_date" id="limit_date" value="{{ old('limit_date') }}">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="consumption_date">{{ __('Date de consommation') }}* : </label>
|
||
<input type="date" name="consumption_date" id="consumption_date" value="{{ old('consumption_date') }}">
|
||
</div>
|
||
</div>
|
||
<div>
|
||
<label for="message">{{ __('Message') }}* : </label>
|
||
<textarea name="message" id="message" cols="30" rows="10">{{ old('message') }}</textarea>
|
||
</div>
|
||
<div>
|
||
<input type="file" name="file" id="file" @if ('topic'=="Réclamation" ) required @endif>
|
||
<label for="file" id="lblFile"></label>
|
||
</div>
|
||
</fieldset>
|
||
<p class="is-small">{!! __('rgpd.contact.disclaimer', ['PRIVROUTE' => route($routeprefixer . 'policy')]) !!}</P>
|
||
<div class="is-small">
|
||
<input type="checkbox" name="rgpd" id="rgpd" required>
|
||
<label for="rgpd">{{ __('rgpd.contact.acceptcgu') }}</label>
|
||
</div>
|
||
<div class="align-center">
|
||
<input type="submit" value="Envoyer">
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
|
||
@endsection
|
||
|
||
@push('scripts')
|
||
<script>
|
||
function showReclaFields() {
|
||
console.log('show');
|
||
var collection = document.getElementsByClassName('recla_field');
|
||
for(let elem of collection) {
|
||
elem.style.display = 'flex';
|
||
}
|
||
document.getElementById('lblFile').innerHTML = 'Photo de l\'emballage*';
|
||
document.getElementById('file').required = true;
|
||
}
|
||
|
||
function hideReclaFields() {
|
||
console.log('hide');
|
||
var collection = document.getElementsByClassName('recla_field');
|
||
for(let elem of collection) {
|
||
elem.style.display = 'none';
|
||
}
|
||
document.getElementById('lblFile').innerHTML = 'Insérer une pièce jointe';
|
||
document.getElementById('file').required = false;
|
||
}
|
||
|
||
function showDromField(sel) {
|
||
if (document.getElementById('country').options[sel.selectedIndex].text=='France') {
|
||
var dromList = document.getElementById('departement');
|
||
dromList.style.display = 'initial';
|
||
dromList.required = true;
|
||
} else {
|
||
hideDromField();
|
||
}
|
||
}
|
||
|
||
function hideDromField() {
|
||
var dromList = document.getElementById('departement');
|
||
dromList.style.display = 'none';
|
||
dromList.required = false;
|
||
}
|
||
|
||
document.addEventListener('DOMContentLoaded', function () {
|
||
hideReclaFields();
|
||
hideDromField();
|
||
@if (old('topic')=="Réclamation")
|
||
showReclaFields();
|
||
@endif
|
||
@if (old('country')=="France")
|
||
showDromField();
|
||
@endif
|
||
});
|
||
|
||
</script>
|
||
@endpush
|