@extends('layouts.squelette')
<!-- ************************************** -->
@section('css_header')

@endsection
<!-- ************************************** -->
@section('titre_header')
{{ __('Matériels référencés') }}
@endsection

@section('titre_page')
{{ __('Liste') }}
@endsection
<!-- ************************************** -->
@section('panel_boutons')
@endsection
<!-- ************************************** -->
@section('contenu')
<div class="row">
    <div class="col-md-4">
        <button class="btn btn-default btn-search" id="BTN_search_equipment">{{ __('Rechercher par QRCode') }}</button>
    </div>
</div>

<div class="row">
    <div class="col-md-12">
        <div class="record-total-wrapper mt-3"></div>
        <table id="tab_equipment" class="table table-striped table-compact table-advance" width="100%" cellspacing="0" data-order='[[ 2, "asc" ]]'>
            <thead class="">
                <tr>
                    <th class="all">{{ __('Nom') }}</th>
                    <th class="desktop">{{ __('N° de série') }}</th>
                    <th class="all">{{ __('Marque') }}</th>
                    <th class="all">{{ __('Référence modèle') }}</th>
                    <th class="desktop">{{ __('N° référence') }}</th>
                    <th class="desktop">{{ __('Localisation') }}</th>
                    <th class="desktop">{{ __('Date installation') }}</th>
                    <th class="desktop">{{ __('DFVT') }}</th>
                    <th class="desktop">{{ __('Fin de garantie') }}</th>
                    <th class="text-right desktop">{{ __('Actions') }}</th>
                </tr>
            </thead>
            <tbody>
                @foreach($equipments as $item)
                <tr>
                    <td>{{ $item->equFam_name ?? $item->equ_name }}</td>
                    <td>{{ $item->equ_serialNumber }}</td>
                    <td>{{ $item->equFam_mark }}</td>
                    <td>{{ $item->equFam_reference }}</td>
                    <td>{{ $item->equ_reference }}</td>
                    <td>{{ $item->equLoc_name }}</td>
                    <td>{!! $item->equ_installDate!='' ? date('d/m/Y', strtotime($item->equ_installDate)) : '' !!}</td>
                    <td>{!! $item->equ_nextActionDate!='' ? date('d/m/Y', strtotime($item->equ_nextActionDate)) : '' !!}</td>
                    <td>{!! $item->equ_endGuaranteeDate!='' ? date('d/m/Y', strtotime($item->equ_endGuaranteeDate)) : '' !!}</td>
                    <td class="text-right">
                        <a href="{{ route('detail_equipment',[$item->equ_id])}}" target="_blank">
                            <button class='btn btn-sm btn-success btn-see btn-circle' data-toggle="tooltip" title="Détail">{{ __('Détail') }}</button>
                        </a>
                    </td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>
@endsection

@section('js_footer')
<script src="{{ asset('js/equipments_site/html5-qrcode.min.js').'?'.env('VERSION_JS')}}"></script>
<script src="{{ asset('js/equipments_site/list.js').'?'.env('VERSION_JS')}}"></script>
@endsection


@section('modale')

<div id="Modale_search_equipment" class="modal fade" role="dialog">
    <div class="modal-dialog modal-xl">
        <!-- Modal content-->
        <form method="post" class="" id="form_search_equipment" name="form_search_equipment" action="{{ route('add_di_equipment') }}" enctype="multipart/form-data">
            @csrf
            {{ csrf_field() }}
            <div class="modal-content">
                <div class="modal-header bg-modal">
                    <h4 class="modal-title text-center">{{ __('Recherche de matériel / équipement') }}</h4>
                </div>

                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-12">

                            {{-- https://www.geeksforgeeks.org/create-a-qr-code-scanner-or-reader-in-html-css-javascript/ --}}
                            <h1>{{ __('Scanner le QRCode du matériel') }}</h1>
                            <div class="sectionQRCode">
                                <div id="my-qr-reader">
                                </div>
                            </div>

                        </div>
                </div>
                <div class="modal-footer">
                    <center>
                        <button type="button" name="BTN_fermermodaleA" id="BTN_fermermodaleA" data-dismiss="modal" class="btn btn-abort">{{ __('Annuler') }}</button>
                        {{-- <button type="submit" class="btn btn-save">{{ __('Ajouter la demande') }}</button> --}}
                    </center>
                </div>

        </form>
    </div>
</div>
</div>

@endsection