@extends('layouts.master')

@section('sidebar')
    @parent

    <p>This is appended to the master sidebar.</p>
@stop

@section('content')



<!-- Card Group  -->
<!-- ============================================================== -->
<div class="row">
    <div class="col-lg-3 col-md-6">
        <div class="card">
            <div class="card-body">
                <h5 class="card-title text-uppercase">Total Vente</h5>
                <div class="d-flex align-items-center">
                    <div>
                        <div id="sparklinedash2"></div>
                    </div>
                    <div class="ml-auto">
                        <h3 class="text-primary mb-0"> {{number_format($Tvente, 2)}} </h3>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-lg-2 col-md-6">
        <div class="card">
            <div class="card-body">
                <h5 class="card-title text-uppercase">Total Perte</h5>
                <div class="d-flex align-items-center">
                    <div>
                        <div id="sparklinedash3"></div>
                    </div>
                    <div class="ml-auto">
                        <h3 class="text-danger mb-0"> {{number_format($Sperte, 2)}} </h3>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-lg-2 col-md-6">
        <div class="card">
            <div class="card-body">
                <h5 class="card-title text-uppercase">Total Dépôt</h5>
                <div class="d-flex align-items-center">
                    <div>
                        <div id="sparklinedash4"></div>
                    </div>
                    <div class="ml-auto">
                        <h3 class="text-success mb-0">{{number_format($depot, 2)}}</h3>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-lg-2 col-md-6">
        <div class="card">
            <div class="card-body">
                <h5 class="card-title text-uppercase">Total Dette</h5>
                <div class="d-flex align-items-center">
                    <div>
                        <div id="sparklinedash"></div>
                    </div>
                    <div class="ml-auto">
                        <h3 class="text-danger mb-0"> {{number_format($DETTE, 2)}} </h3>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-lg-3 col-md-6">
        <div class="card">
            <div class="card-body">
                <h5 class="card-title text-uppercase">Total Commussion</h5>
                <div class="d-flex align-items-center">
                    <div>
                        <div id="sparklinedash"></div>
                    </div>
                    <div class="ml-auto">
                        <h3 class="text-info mb-0"> {{number_format($totalcommussion, 2)}} </h3>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- ============================================================== -->

    <!-- Start Page Content -->
    <!-- ============================================================== -->

    <!-- ============================================================== -->
    <!-- End PAge Content -->

<div class="card">
    <!-- Nav tabs -->
    <ul class="nav nav-tabs manage-tabs tabs-success" role="tablist">
        <li class="nav-item">
            <a class="nav-link active" data-toggle="tab" href="#users" role="tab">
                <span class="hidden-sm-up">
                    <h4><i class="ti-home"></i></h4>
                </span>
                <span class="d-none d-md-block">Banques</span>
            </a>
        </li>
        <li class="nav-item">
            <a class="nav-link" data-toggle="tab" href="#permissions" role="tab">
                <span class="hidden-sm-up">
                    <h4><i class="ti-user"></i></h4>
                </span>
                <span class="d-none d-md-block">Responsables</span>
            </a>
        </li>
    </ul>
    <!-- Tab panes -->
    <div class="tab-content">
        <div class="tab-pane active" id="users" role="tabpanel">
            <div class="bg-light">
                <!-- Data Banques -->
                <div class="card">
                <div class="card-body">
                    <div class="d-flex no-block align-items-center mb-4">
                        <h4 class="card-title">Payroll<br/><small></small></h4>

                    </div>

                    <div class="table-responsive">
                                    <table id="zero_config" class="table table-striped border">
                            <thead>
                                <tr>
                                    <!-- <th>Nbres de Banque</th> -->
                                    <th>Nbrs Banque</th>
                                    <th>%</th>
                                    <th>Vente</th>
                                    <th>perte</th>
                                    <th>Dépôt</th>
                                    <th>Dette</th>
                                    <th>Commussion</th>
                                    <th>Payroll</th>
                                </tr>
                            </thead>
                            <tbody>
                                                            </tbody>
                        </table>
                    </div>
                    <div class="modal-footer">
                        <!-- <a href="" alt="default" data-toggle="modal" data-target="#payroll" class="btn btn-info waves-effect waves-light">Appliquer Payroll</a> -->
                    </div>
                </div>
            </div>
                <!-- End Data Banque -->
            </div>
            <div class="d-flex align-items-center p-4 mt-2">
                <h3 class="font-light">{{$nbrBK}} Banque(s)</h3>
            </div>
        </div>
        <div class="tab-pane" id="permissions" role="tabpanel">
            <div class="row py-4 px-5 no-gutters mt-3">
                <div class="col-sm-12 col-md-6">
                    <h3 class="font-light">Payroll des Responsables</h3>
                </div>
            </div>
            <div class="bg-light">
                <!-- Data Responsable -->
                <div class="card">
                    <div class="card-body">
                        <div class="d-flex no-block align-items-center mb-4">
                            <h4 class="card-title">Payroll<br/><small></small></h4>

                        </div>
                        <div class="table-responsive">
                            <table id="zero_config" class="table table-striped border">
                                <thead>
                                    <tr>
                                        <th>Responsables</th>
                                        <th>%</th>
                                        <th>Vente</th>
                                        <th>perte</th>
                                        <th>Depot</th>
                                        <th>Dette</th>
                                        <th>Commussion</th>
                                        <th>Payroll</th>
                                    </tr>
                                </thead>
                                <tbody>
                                                                    </tbody>
                            </table>
                        </div>
                    </div>
                </div>
                <!-- End Data Responsable -->
            </div>
            <div class="d-flex align-items-center p-4 mt-2">
                <h3 class="font-light">{{sizeof($responsables)}} Responsable(s)</h3>
            </div>
        </div>

    </div>
</div>

    <script type="text/javascript">
        function PrintDivDepot()
        {
            var mywindow = window.open('', 'PRINT','');

            mywindow.document.write('<html><body >');
            mywindow.document.write(document.getElementById('divToPrintdepot').innerHTML);
            mywindow.document.write('</body></html>');

            mywindow.document.close(); // necessary for IE >= 10
            mywindow.focus(); // necessary for IE >= 10*/

            mywindow.print();
            mywindow.close();
            return true;
        }
    </script>

@stop