@extends('both.template')
@section('title', 'ESTIMATIONS | OPTIMIA')

@section('styleSheets')
    <!-- Select2 CSS -->
    <link rel="stylesheet" href="{{ asset('css/select2.min.css') }}">
    <!-- Datetimepicker CSS -->
    <link rel="stylesheet" href="{{ asset('css/bootstrap-datetimepicker.min.css') }}">
@endsection

@section('content')
    <!-- Page Wrapper -->
    <div class="page-wrapper">

        <!-- Page Content -->
        <div class="content container-fluid">

            <!-- Page Header -->
            <div class="page-header">
                <div class="row align-items-center">
                    <div class="col">
                        <h3 class="page-title">Estimations</h3>
                        <ul class="breadcrumb">
                            <li class="breadcrumb-item">Comptes</li>
                            <li class="breadcrumb-item active">Listing des estimations</li>
                        </ul>
                    </div>
                    <div class="col-auto float-right ml-auto">
                        <a href="{{ url('/root/estimates/create/') }}" class="btn add-btn"><i class="fa fa-plus"></i> Créer une estimation</a>
                    </div>
                </div>
            </div>
            <!-- /Page Header -->

            <!-- Search Filter -->
            <div class="row filter-row">
                <div class="col-sm-6 col-md-3">
                    <div class="form-group form-focus">
                        <div class="cal-icon">
                            <input class="form-control floating datetimepicker" type="text">
                        </div>
                        <label class="focus-label">Du</label>
                    </div>
                </div>
                <div class="col-sm-6 col-md-3">
                    <div class="form-group form-focus">
                        <div class="cal-icon">
                            <input class="form-control floating datetimepicker" type="text">
                        </div>
                        <label class="focus-label">Au</label>
                    </div>
                </div>
                <div class="col-sm-6 col-md-3">
                    <div class="form-group form-focus select-focus">
                        <select class="select floating">
                            <option>Selectionnez un status</option>
                            @foreach($states as $state)
                                <option value="{{ $hashids->encode($state->idEstimateState) }}" >Estimation {{ $state->estimateStateName }}</option>
                            @endforeach
                        </select>
                        <label class="focus-label">Status de l'estimation</label>
                    </div>
                </div>
                <div class="col-sm-6 col-md-3">
                    <a href="#" class="btn btn-success btn-block"> Rechercher </a>
                </div>
            </div>
            <!-- /Search Filter -->

            <div class="row">
                <div class="col-md-12">
                    <div class="table-responsive">
                        <table class="table table-striped custom-table mb-0">
                            <thead>
                            <tr>
                                <th>#</th>
                                <th>Code Estimation</th>
                                <th>Client</th>
                                <th>Date de création</th>
                                <th>Date d'expiration</th>
                                <th>Montant</th>
                                <th>Status</th>
                                <th class="text-right">Action</th>
                            </tr>
                            </thead>
                            <tbody>
                                @php
                                    $colors = [
                                        'Envoyée' => 'info',
                                        'Acceptée' => 'success',
                                        'Rejettée' => 'danger',
                                        'Expirée' => 'warning',
                                        'Nouvelle' => 'purple'
                                    ];
                                    $i = 1;
                                @endphp
                                @foreach($estimates as $estimate)
                                    <tr>
                                        <td>{{ $i }}</td>
                                        <td><a href="{{ url('/root/estimates/details/'.$hashids->encode($estimate->idEstimateBoard)) }}">{{ $estimate->estimateCode }}</a></td>
                                        <td>{{ $estimate->clientFullName }}</td>
                                        <td>{{ App\Utils\Utils::getDBDateFormat($estimate->estimateCreatedDate, true) }}</td>
                                        <td>{{ App\Utils\Utils::getDBDateFormat($estimate->estimateExpiryDate, true) }}</td>
                                        <td>
                                            <strong>
                                                <script type="text/javascript">
                                                    document.write(
                                                        new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'XOF' }).format('{{ $estimate->estimateGrandTotal }}')
                                                    );
                                                </script>
                                            </strong>
                                        </td>
                                        <td><span class="badge bg-inverse-success">{{ $estimate->estimateStateName }}</span></td>
                                        <td class="text-right">
                                            <div class="dropdown dropdown-action">
                                                <a href="#" class="action-icon dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><i class="material-icons">more_vert</i></a>
                                                <div class="dropdown-menu dropdown-menu-right">
                                                    <a class="dropdown-item" href="#"><i class="fa fa-pencil m-r-5"></i> Editer</a>
                                                    <a class="dropdown-item" href="{{ url('/root/estimates/details/'.$hashids->encode($estimate->idEstimateBoard)) }}"><i class="fa fa-eye m-r-5"></i> Details</a>
                                                    <a class="dropdown-item" href="#"><i class="fa fa-file-pdf-o m-r-5"></i> Télécharger</a>
                                                    <a class="dropdown-item" href="#"><i class="fa fa-trash-o m-r-5"></i> Supprimer</a>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
                                    @php $i++; @endphp
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
        <!-- /Page Content -->

    </div>
    <!-- /Page Wrapper -->
@endsection

@section('scriptsSheets')
    <script src="{{ asset('js/select2.min.js') }}"></script>
    <!-- Datetimepicker JS -->
    <script src="{{ asset('js/moment.min.js') }}"></script>

    <script src="{{ asset('js/bootstrap-datetimepicker.min.js') }}"></script>
    <script type="text/javascript">

    </script>
@endsection