ldc-bogt/resources/views/front/egg/search.blade.php

@extends('layouts.front')
@section('title', __('Traçabilité des Volailles de Loué'))
@section('description', __('Recherchez la treaceabilité de votre produit Loué ainsi que sa provenance.'))

@section('breadcrumb', request()->route()->getName())

@section('content')
<div class="container oldEgg">
    <div class="block-fill">
        <div class="header">
            <p><span>Tout connaître</span><br>de l’origine de mes œufs</p>
        </div>
        <div class="body">
            <p class="message blue">Merci de compléter ces indications que<br>vous trouverez sur votre boîte d’œufs :</p>
            <form action="{{ route('egg.searchSubmit') }}" method="POST">
                @csrf
                <div class="item">
                    <label>Code du producteur <span>A</span> :</label>
                    <input type="text" name="code" placeholder="Ex. 1FRJBB01" required>
                </div>
                <div class="item">
                    <label>Date de consommation<br>recommandée (DCR) <span>B</span> :</label>
                    <input type="text" name="date" placeholder="JJ/MM" pattern="[0-9]{2}/[0-9]{2}" required>
                </div>

                <input type="submit" value="Valider">
            </form>
        </div>
        <div class="footer d-flex justify-content-center mt-5">
            <p>Informations sur l'oeuf :</p>
            <div class="box">
                <img src="{{ asset('assets/images/egg/oeuf.png') }}" alt="Oeuf" width="70%">
                {{--<p>Pondu le<br><span class="date">14/12</span></p>
                <p>À cons. de préf. avant le
                    <br><span class="date">11/01</span><span class="step">A</span>
                    <br><span class="prod">1FR0PD01</span><span class="step">B</span>
                </p>--}}
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script nonce="{{ $nonce }}">
    document.addEventListener('DOMContentLoaded', function() {
        $(document).ready(function() {
            $('input[name=date]').bind('keyup', 'keydown', function(e) {
                //To accomdate for backspacing, we detect which key was pressed - if backspace, do nothing:
                if (e.which !== 8) {
                    var numChars = $(this).val().length;
                    var thisVal = $(this).val();
                    if (numChars === 2) {
                        thisVal += '/';
                        $(this).val(thisVal);
                    }
                    if (numChars >= 3) {
                        if (thisVal.charAt(2) != '/') {
                            thisVal = thisVal.substring(0, 2) + '/' + thisVal.substring(2);
                            $(this).val(thisVal);
                        }
                    }
                }
            });
        });
    });
</script>
@endpush