@extends('layouts.app')

@section('content')

    <div class="row">
        <div class="col-xl-9 wid-100">
            <div class="row">
                @include('app.dashboard.counter')
                <div class="col-xl-8">
                    <div class="card overflow-hidden">
                        <div class="card-header border-0 pb-0 flex-wrap">
                            <h4 class="heading mb-0">Chiffre d'affaire</h4>
                        </div>
                        <div class="card-body  p-0">
                            <div id="overiewChart"></div>
                            <div class="ttl-project">
                                <div class="pr-data">
                                    <h5>0</h5>
                                    <span>Analyse aujourd'hui</span>
                                </div>
                                <div class="pr-data">
                                    <h5 class="text-primary">721</h5>
                                    <span>Caisse</span>
                                </div>
                                <div class="pr-data">
                                    <h5>$2,50,523</h5>
                                    <span>Mensuel</span>
                                </div>
                                <div class="pr-data">
                                    <h5 class="text-success">12,275h</h5>
                                    <span>Annuel</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-4">
                    <div class="card">
                        <div class="card-header border-0">
                            <h4 class="heading mb-0">Opérations</h4>
                        </div>
                        <div class="card-body p-0">
                            <div id="DZ_W_TimeLine11" class="widget-timeline dz-scroll style-1  my-4 px-4">
                                <ul class="timeline" style="overflow-y: scroll; height:400px;">

                                    @foreach(\App\Models\Operation::latest()->get()->take(10) as $ops)
                                        <li>
                                            <div class="timeline-badge primary"></div>
                                            <a class="timeline-panel" href="#">
                                                <span>Caisse N°: {{$ops->caisse->number}}</span>
                                                <h6 class="mb-0"><strong class="text-primary">{{formatpriceth($ops->amount, getCurrency())}}</strong> | Dossier: @if($ops->analysis) {{$ops->analysis->matricule}} @endif  .</h6>
                                                <span>Payé par: {{$ops->paymentMethod->name}}</span>
                                            </a>
                                        </li>
                                    @endforeach

                                </ul>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
       @include('app.dashboard.activity')
    </div>
@endsection

@section('scripts')
    <!-- Dashboard 1 -->
    <script src="{{asset('assets/admin/js/dashboard/dashboard-1.js')}}"></script>
    <script src="{{asset('assets/admin/vendor/draggable/draggable.js')}}"></script>


    <!-- tagify -->
    <script src="{{asset('assets/admin/vendor/tagify/dist/tagify.js')}}"></script>

    <script src="{{asset('assets/admin/vendor/datatables/js/jquery.dataTables.min.js')}}"></script>
    <script src="{{asset('assets/admin/vendor/datatables/js/dataTables.buttons.min.js')}}"></script>
    <script src="{{asset('assets/admin/vendor/datatables/js/buttons.html5.min.js')}}"></script>
    <script src="{{asset('assets/admin/vendor/datatables/js/jszip.min.js')}}"></script>
    <script src="{{asset('assets/admin/js/plugins-init/datatables.init.js')}}"></script>

    <!-- Apex Chart -->

    <script src="vendor/bootstrap-datetimepicker/js/moment.js')}}'"></script>
    <script src="vendor/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js')}}'"></script>


    <!-- Vectormap -->
    <script src="{{asset('assets/admin/vendor/jqvmap/js/jquery.vmap.min.js')}}"></script>
    <script src="{{asset('assets/admin/vendor/jqvmap/js/jquery.vmap.world.js')}}"></script>
    <script src="{{asset('assets/admin/vendor/jqvmap/js/jquery.vmap.usa.js')}}"></script>
    <script src="{{asset('assets/admin/js/custom.js')}}"></script>
    <script src="{{asset('assets/admin/js/deznav-init.js')}}"></script>
    <script src="{{asset('assets/admin/js/demo.js')}}"></script>
    <script src="{{asset('assets/admin/js/styleSwitcher.js')}}"></script>
@endsection